JavaScript onclick event retrieve attribute?

Question

I have some 3D shapes on a page (X3DOM) that I would like to identify when clicked with the mouse. My HTML looks like this :

<Transform translation='0 0 0'> 
                    <shape id="Roger1" number="54 -15 -34" onclick="changeColor();"> 
                        <appearance> 
                            <material diffuseColor='1 0 0'></material> 
                        </appearance> 
                        <sphere>radius='1' </sphere> 
                    </shape> 
                </Transform>

Then, in JavaScript, I have the corresponding function set up this way :

function changeColor() {
    window.alert('clicked');
}

This works great. But I don't see how I could recover the information contained in the "number" tag, number="54 -15 -34"? Any help is appreciated.

Spectric · Accepted Answer · 2021-12-09 02:36:37Z

1

You can pass the element itself as a parameter to the function:

function changeColor(element) {
    window.alert(element.getAttribute('number'));
}

<Transform translation='0 0 0'>
  <shape id="Roger1" number="54 -15 -34" onclick="changeColor(this);">
    <appearance>
      <material diffuseColor='1 0 0'></material>
    </appearance>
    <sphere>radius='1' </sphere>
  </shape>
</Transform>

answered Dec 9, 2021 at 2:36

Spectric

32.6k6 gold badges32 silver badges56 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Roger Breton Over a year ago

There was a solution, here, under "stackoverflow.com/questions/4825295/…" which I only found after posting my question -- naturally? -- but I'll go along with your fine suggestion -- thank you so much!

Collectives™ on Stack Overflow

JavaScript onclick event retrieve attribute?

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related