IE 6,7,8 Warning with removeChild

On a removeChild function call, Internet Explorer complains: “Do you want to view only the webpage content that was delivered securely?”. This is a particularly obscure bug with IE that has caused me lots of grief. First of all, it is indeed a bug with IE. This behavior can be repeated with 100% HTTPS content all on the same domain (see example below).

The popup looks like this and it’s loosely related to this article but not quite. However, that article doesn’t include IE8 at all and leaves out lots of important details.

You can trigger this behavior under the following conditions:

• You are viewing an HTTPS web page in IE 6, 7 or 8
• You add a background image to an element that has a submit <input> as a child using JavaScript
• The background image added references a resource with a relative path
• You remove that element from the DOM with JavaScript using removeChild (jQuery uses this under the hood with $(element).remove() )

Example here:

https://meub.s3.amazonaws.com/breakingIE.html

Some Potential Fixes

• Call $(child).css('background', 'none'); before calling removeChild();
• Always use Absolute URLs for resources loaded dynamically
• Stop caring about supporting crappy browsers

Additional Thoughts

I would guess that this bug comes from some ancient attempt at security by Microsoft to keep malicious devs from stealing a click event that was directed at a button. Still it makes no sense at all and it’s a seriously annoying/obscure bug.