appendChild doesn#39;t work correctly in IE(appendChild 在 IE 中无法正常工作)
问题描述
我正在尝试创建一个简单的模态窗口,但 IE 不配合.当我在IE中调用这个函数时,内容出现在所有内容下的页面底部,并且没有出现覆盖图像.代码如下:
I am trying to create a simple Modal window, but IE isn't cooperating. When I call this function in IE, the content appears at the bottom of the page under all content and the overlay image does not appear. Here's the code:
function applyOverlay(src)
{
var my_overlay = document.createElement('div');
my_overlay.setAttribute('id','myoverlay');
var doc_height = document.body.scrollHeight;
my_overlay.setAttribute('style','text-align:center; position:fixed; top:0px; left:0px; background-image:url("images/trbg.png"); width:100%; height:'+doc_height+'; z-index:999;');
my_overlay.innerHTML="<iframe style='background:none;' frameborder=0 height='100%' width='80%' src='"+src+"'><iframe>";
document.body.appendChild(my_overlay);
}
推荐答案
这是常见的 IE 问题.这很烦人,但可以控制.
This is common IE issue. It is irritating, but managable.
如果 document.body.appendChild 在 body 关闭之前在 body 标签内执行,IE6 将不会加载页面.7和8会等到页面加载完毕
If document.body.appendChild is executed within the body tag before the body is closed, IE6 will simply not load the page. 7 and 8 will wait until the page is loaded
那么,如何解决这个问题?
So, how to approach this issue?
- 等到正文加载完毕,使用 body.onload.
- 将元素附加到另一个元素而不是正文标记.
我推荐第二个选项.将元素附加到另一个目标元素将保留预期的行为,并且不会改变您将元素添加到网站的方式.
I recommend the second option. Appending elements to another target element will preserve the intended behavior and not change the way you add your elements to the site.
这篇关于appendChild 在 IE 中无法正常工作的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:appendChild 在 IE 中无法正常工作
基础教程推荐
- 自定义 XMLHttpRequest.prototype.open 2022-01-01
- 如何使用TypeScrip将固定承诺数组中的项设置为可选 2022-01-01
- Vue 3 – <过渡>渲染不能动画的非元素根节点 2022-01-01
- html表格如何通过更改悬停边框来突出显示列? 2022-01-01
- Electron 将 Node.js 和 Chromium 上下文结合起来意味着 2022-01-01
- 如何使用JIT在顺风css中使用布局变体? 2022-01-01
- 直接将值设置为滑块 2022-01-01
- Chart.js 在线性图表上拖动点 2022-01-01
- 用于 Twitter 小部件宽度的 HTML/CSS 2022-01-01
- 我可以在浏览器中与Babel一起使用ES模块,而不捆绑我的代码吗? 2022-01-01