I’m writing a GreaseMonkey script that modifies an attribute of an element with a specific ID, but I’m having some problems accessing it due to a nontraditional HTML hierarchy. Here’s the relevant HTML:
<body>
...
<iframe id="iframeID">
<html>
...
<body id="bodyID" attribute="value">
...
</body>
...
</html>
</iframe>
...
</body>
Where attribute is the attribute that I’m attempting to modify.
At first, not realizing I was working with an iframe and a nested body tag, I tried this:
document.getElementById('bodyID').setAttribute("attribute","value")
While this worked fine in Firefox, Chrome tells me that I can’t set the attribute of null, suggesting that it cannot find any elements with the id bodyID. How can I modify this attribute in a cross-browser friendly fashion?
You first need to pull the document of the
<iframe>:Live DEMO
BTW, if you want to get the
<body>node, you don’t need to give id or something like that, simply:In your case, it’s the document of the
<iframe>:A lot simpler… Isn’t it?