React

HTML

<div id="app"></div>

React

class GettingAttributes extends React.Component {
  constructor(props) {
    super(props)
    this.state = {value: 'Hello!'};
    
    this.bar = this.bar.bind(this);
    this.barById = this.barById.bind(this);
  }
  
  bar(e){
  	if(this.divElement){
  		this.setState({value: this.divElement.getAttribute("data-value")});
    }
  }
  
  barById(e){
  	if(this.divElement){
  		this.setState({value: this.divElement.id});
    }
  }
  
  render() {
    return (
      <div data-value="foo" id="foo id" ref={(element) => this.divElement = element}  onClick={this.bar}>
        <p>{this.state.value}</p>
      </div>
    );
  }
}

ReactDOM.render(<GettingAttributes />, document.querySelector("#app"))