Question

我正在制作一个网站模板，并决定尝试使用外部JS文件将html插入页面顶部进行导航（而不是每次都要复制和粘贴）

我正在尝试使用（作为标题状态）.innerHTML标记来执行此操作，以便我可以编辑整个代码。

这是：

的JavaScript

document.getElementById("insert").innerHTML += '<script         language="javascript"> 
function toggle() {
var ele = document.getElementById("toggleText");
var text = document.getElementById("displayText");
if(ele.style.display == "inline") {
        ele.style.display = "none";
    text.innerHTML = '<img src="http://www.psdgraphics.com/file/down-    arrow-icon.jpg" height="25" width="25">';
}
else {
    ele.style.display = "inline";
    text.innerHTML = '<img src="http://www.psdgraphics.com/file/up-arrow-icon.jpg" height="25" width="25">';
}
} 
</script>
<body>

 <a id="displayText" href="javascript:toggle();"><img     src="http://www.psdgraphics.com/file/down-arrow-icon.jpg" height="25" width="25"></a><span style="text-size: 30px;">Logo</span>

<div id="toggleText" class="navbar" style="display: none">
<div style="background-color: #8CBADB; text-align:center; height:25px; width:250px; border: .5px solid black;">
<a href="#">Home</a>
<a href="#">About</a></div>
</div>
<br>
Content';

HTML

 <!DOCTYPE html>
 <html>
 <head>
  <meta charset="utf-8">
  <title></title>
   </head>
  <div id="insert"></div>
</body>
</html>

我已经仔细检查过我的引号，我通过JSLint运行它，并检查可能的语法错误。到目前为止，我什么都没有。

我出错了什么？

Answer 1

您需要分配但不能连接。

document.getElementById("insert").innerHTML += 
// Remove + from here----------------------^^

Answer 2

我在你的代码中看到两个问题：

您只需要在第1行中分配，删除连接符号+

document.getElementById("insert").innerHTML + =
在第7行和第11行避免使用单引号，而是使用双引号，它使用了错误的语法，因为它将在此处结束表达式。

使用javascript .innerHTML将html插入网页

2 个答案: