CODEWITHSUNDEEP
javascriptsafari
jo88
jo88

Reputation: 23

document.getelementbyid not working

I wanted to hide some stuff by accessing to the iframe using javascript so I wrote this javascript function.

function changeCSS(){ 
frame = document.getElementById('frame1'); 
frame.contentWindow.document.getElementById('GlobalTitleAreaImage').style.display='none'; 
}

I then called the function when I load the iframe (onload= javascript: changecss())

Everything seems to work fine in IE but in Safari it does't work. Any ideas why it is behaving this way and how I should fix this.

Thanks

Upvotes: 2

Views: 1956

Answers (2)

justkt
justkt

Reputation: 14766

Note that both the frame and the location of the Javascript itself must be on the same domain for this to work. Safari and IE may handle it differently if both are from the file protocol, also.

For ones that are not in the same domain look into cross-domain communication with iframes and the potential HTML 5 solution, wrapped nicely with fallback methods by libraries & plugins such as porthole, xssinterface, easyxdm, and others.

While Safari is listed as supporting content Window, Chrome is not. For cross-browser compatibility use a combination of contentWindow and contentDocument to ensure you hit on a supported property. So try:

function changeCSS(){ 
    var frame = document.getElementById('frame1'); 
    var content = frame.contentWindow || frame.contentDocument;
    content.document.getElementById('GlobalTitleAreaImage').style.display='none'; 
}

Upvotes: 1

ADW
ADW

Reputation: 4080

If the iframe isn't in the same domain then you aren't allowed to do this for security reasons.

Upvotes: 0

Related Questions