Altering CreateElement method via Javascript doesn't work for iframes

Question

I would like to globally redefine a createElement method, but unfortunately it only works in a main document, and is ignored in iframes. Let's take this example code:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script>
    old_createElement = document.createElement;
    document.createElement = function(el_type) {
        new_el = old_createElement.call(this, el_type);
        new_el.style.color="red";
        return new_el;
    };
</script>
</head>
<body bgcolor="white">
<iframe id="iframe1"></iframe>

<script type="text/javascript">
 window.setTimeout(function(){
    iframe_el = document.getElementById("iframe1").contentDocument.createElement("div");
    iframe_el.innerHTML = 'inside iframe';
    document.getElementById("iframe1").contentDocument.body.appendChild(iframe_el);
 },50);

 no_iframe_el=document.createElement('div');
 no_iframe_el.innerHTML = 'outside of iframe';
 document.body.appendChild(no_iframe_el);
</script>

</body>
</html>

When i open in in a browser, the element created in a main document has red color, as expected, but the one in the iframe is black.

The problem is that I only have control on the script contained in the HEAD section of the document. In other words, i don't know how many iframes there will be later on in the HTML source, or how they will be names, or if they are added via user's Javascript.

My question is: how can i change the method globally, so all elements created in iframes also use this new style?

Thanks a lot!

each iframe has it's own scope/global scope/dom/css/whatever so your document.createElement is not available there — llamerr
– llamerr, Commented Apr 10, 2016 at 8:35
answer is: no. because: security. you can't write your viruses or whatever — llamerr
– llamerr, Commented Apr 10, 2016 at 8:36

jfriend00 · Accepted Answer · 2016-04-10 09:13:12Z

1

Each frame has it's own separate Javascript context. If you want to change that frame's context, you have to do it specifically for that frame.

In your specific example, each frame has its own document object so it should be no surprise that each document has its own .createElement property.

You cannot generically change things in a way that will affect all frames. And, in fact if it's a cross-origin frame, you can't change it at all.

answered Apr 10, 2016 at 9:13

jfriend00

711k104 gold badges1.1k silver badges1k bronze badges

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

Collectives™ on Stack Overflow

Altering CreateElement method via Javascript doesn't work for iframes

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related