为啥 innerHtml 不起作用
Posted
技术标签:
【中文标题】为啥 innerHtml 不起作用【英文标题】：Why innerHtml doesn't work为什么 innerHtml 不起作用 【发布时间】：2013-02-13 18:15:25 【问题描述】：为什么innerhtml 不起作用？
<script src="jquery.js"></script>
<script type="text/javascript">
function chat()
alert ("started!");
document.getElementById("test").innerHtml="foo";
</script>
<body id="body" onload="chat();">
<p id="test">
test..
</p>
</body>
“开始了！”正在显示，但 <p> 的内容并未按预期更改为 foo。为什么？
【问题讨论】：
@Cœur 对近五年来的无用帖子进行编辑，除了将其撞回主页之外没有任何效果，往好里说似乎毫无意义，往坏里说是有害的。 @torazaburo 一些关于频繁错字的问题并非没用。相关：meta.***.com/questions/269605/… 无论问题是否无用，编辑它肯定是。您引用的问题不属于“简单”的印刷错误，但确实如此。 【参考方案1】：外壳很重要，innerHTML 不是 innerHtml。试试这个：
document.getElementById("test").innerHTML="foo";
【讨论】：
上帝保佑你！我花了半个小时才找到答案【参考方案2】：JavaScript 是一种区分大小写的语言，因此您应始终检查所编写代码的大小写。
尝试使用“innerHTML”代替“innerHtml”。
此外，在 JavaScript 中使用单引号(') 代替双引号(") 是一个好习惯。
【讨论】：
为什么不用双引号？ @les：查看此页面以供参考 - bytearcher.com/articles/…【参考方案3】：如果您正在处理返回 XML 的 API，那么您可能没有任何 innerHtml。大多数浏览器都支持outerHtml。试试这个
function getHTML(node)
if(!node || !node.tagName) return '';
if(node.outerHTML) return node.outerHTML;
// polyfill:
var wrapper = document.createElement('div');
wrapper.appendChild(node.cloneNode(true));
return wrapper.innerHTML;
【讨论】：
【参考方案4】：如果您使用的是 mac，请尝试使用
document.getElementById("test").firstChild.nodeValue = "foo";
【讨论】：
以上是关于为啥 innerHtml 不起作用的主要内容，如果未能解决你的问题，请参考以下文章