I was trying to create a google chrome extension for google meet, so I looked to the html code of Meet, and I saw a lot of property like jsaction="data"; jscontroller="data"; jsname="data"; jsmodel="data".

The property id="data" never appears, so I don't know how to use js to find elements with a given id (document.getElementById("data")), so I think I have to work with that weird properties.

I tried to google for them, but I wasn't able to find anything useful. Does anyone know what they are, and how to work with them?

Thanks in advance.

I was trying to create a google chrome extension for google meet, so I looked to the html code of Meet, and I saw a lot of property like jsaction="data"; jscontroller="data"; jsname="data"; jsmodel="data".

The property id="data" never appears, so I don't know how to use js to find elements with a given id (document.getElementById("data")), so I think I have to work with that weird properties.

I tried to google for them, but I wasn't able to find anything useful. Does anyone know what they are, and how to work with them?

Thanks in advance.

• javascript
• html
• google-chrome-extension
• google-meet

1 Answer 1

jscontroller, jsmodel, jsaction, etc. are part of Google's code library. (They're relatively unknown to those who don't work at Google.)

If you just want to find the HTML element, you can access those elements with something like

document.querySelector("[jscontroller="+data+"]") 

(You can substitute jscontroller with any other element attribute.)

This uses the [attribute=value] css selector, which you can read more about here.