为什么onclick无法使用innerHtml

时间:2017-06-08 05:35:11

标签: javascript

这里我试图使用innerHtml

将html添加到元素中
  <body>
 <h3>Dynamically Retrieve the chapter name</h3>
<div>
<div>
    <button id="addChapter">Add Chapter</button>
    <div id="courseStructure">

    </div>
 </div>
 </div>
<script src="index.js"></script>
</body>

JS:

var addChapter = document.getElementById("addChapter");

  addChapter.onclick = function(){
document.getElementById("courseStructure").innerHtml += '<div><input type="text" name="chaptername" placeholder="chapter name"/><button id="addSubChapter">Add SubChapter</button><button id="addContent">Add Content</button><br><br></div>';
 }

一切似乎都很好onclick事件在点击按钮时触发但是html没有被添加到元素中。

3 个答案:

答案 0 :(得分:0)

innerHtml更改为innerHTML

&#13;
&#13;
var addChapter = document.getElementById("addChapter");

  addChapter.onclick = function(){
document.getElementById("courseStructure").innerHTML += '<div><input type="text" name="chaptername" placeholder="chapter name"/><button id="addSubChapter">Add SubChapter</button><button id="addContent">Add Content</button><br><br></div>';
 }
&#13;
<h3>Dynamically Retrieve the chapter name</h3>
<div>
<div>
    <button id="addChapter">Add Chapter</button>
    <div id="courseStructure">

    </div>
 </div>
 </div>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

你可以选择js:

<button id="addChapter" onclick="myFunction()">Add Chapter</button>

或:

yourAdObject.setRewardedVideoAdListener(this);

答案 2 :(得分:0)

您还没有以正确的格式编写innerHTML。它的innerHTML而不是innerHtml 你的代码应该是..

<body>
<h3>Dynamically Retrieve the chapter name</h3>
<div>
<div>
<button id="addChapter">Add Chapter</button>
<div id="courseStructure">

</div>
</div>
</div>
<script src="index.js"></script>
</body>

您的.JS文件将是。

var addChapter = document.getElementById("addChapter");

addChapter.onclick = function()
{
document.getElementById("courseStructure").innerHTML += '<div><input type="text" name="chaptername" placeholder="chapter name"/>
<button id="addSubChapter">Add SubChapter</button>
<button id="addContent">Add Content</button>
<br><br></div>';
}