.InnerHTML在Internet Explorer中无法正常工作 [英] .InnerHTML Not working properly in Internet Explorer
问题描述
我想为HTML控件的innerHTML分配一个链接标记。但是这在Internet Explorer中无法正常工作。但是，当我尝试分配< link> & < style> 标记它可以正常工作。
< html>
< head>
< script type =text / javascript>
函数getValue（）
{
var x = document.getElementById（myHeader）;
x.innerHTML ='< link \http://test.com/css/template.css\ = \stylesheet \>< div> abc< / div> ;';
alert（x.innerHTML）;
}
< / script>
< / head>
< body>
< h1 id =myHeaderonclick =getValue（）>点击我！< / h1>
< / body>
< / html>
另外，如果我更改< div> 标签和< link> 标签，它在Internet Explorer中也能正常工作。
x.innerHTML ='< div> abc< / div>< link \http://test.com/css/template.css\ = \stylesheet \ >';
请建议！谢谢。
编辑：这是ExtJs的Internet Explorer中的一个错误。更多信息
http://www.sencha.com/forum/showthread.php?30110-internet-explorer-autoLoad-css-not-applied
innerHTML在IE中不起作用，但使用DOM方法：
function getValue（）
{
var x = document.getElementById（myHeader）
，link = document.createElement（'link'）
， div = document.createElement（'div'）;
x.innerHTML ='';
x.appendChild（link）;
x.appendChild（div）;
div.innerHTML ='abc';
link.href ='http://test.com/css/template.css';
link.rel ='stylesheet';
alert（x.innerHTML）; b
尽管 reference 指出链接标签只能出现在标题中，足够有趣的风格链接如果您使用我提供的代码，我试过的所有浏览器（IE，Firefox，Chrome）都可以使用 。请参阅这个jsfiddle （我使用test.com的一个真正的css-href; - ）
如果您希望将链接放入合适的部分（< head> ），使用：
var header = document.getElementsByTagName（'head'）[0];
，link = document.createElement（'link'）;
header.appendChild（link）;
link.href ='http://test.com/css/template.css';
link.rel ='stylesheet';
I wanted to assign a link tag to innerHTML of a HTML control. But this is not working properly in Internet Explorer. However when I try to assign anything other than <link> & <style> tags it works fine.
<html>
<head>
<script type="text/javascript">
function getValue()
{
var x=document.getElementById("myHeader");
x.innerHTML='<link \"http://test.com/css/template.css\" rel=\"stylesheet\"><div>abc</div>';
alert(x.innerHTML);
}
</script>
</head>
<body>
<h1 id="myHeader" onclick="getValue()">Click me!</h1>
</body>
</html>
Also, If I change sequence of <div> tag and <link> tag above it works fine in Internet Explorer also.
x.innerHTML='<div>abc</div><link \"http://test.com/css/template.css\" rel=\"stylesheet\">';
Please suggest! Thanks.
EDIT: This is a bug in Internet Explorer with ExtJs. More information at
http://www.sencha.com/forum/showthread.php?30110-internet-explorer-autoLoad-css-not-applied
innerHTML won't work in IE, but using DOM methods it will:
function getValue()
{
var x=document.getElementById("myHeader")
, link = document.createElement('link')
, div = document.createElement('div');
x.innerHTML = '';
x.appendChild(link);
x.appendChild(div);
div.innerHTML = 'abc';
link.href = 'http://test.com/css/template.css';
link.rel = 'stylesheet';
alert(x.innerHTML);
}
Although the reference states a link tag may only appear in the header, interesting enough the style link does work if you use the code I provided, in all browsers I tried (IE, firefox, chrome). See this jsfiddle (where I used a real css-href from test.com ;-)
If you however want to place the link in it's rightful section (<head>), use:
var header = document.getElementsByTagName('head')[0];
, link = document.createElement('link');
header.appendChild(link);
link.href = 'http://test.com/css/template.css';
link.rel = 'stylesheet';
这篇关于.InnerHTML在Internet Explorer中无法正常工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
