我想在每次单击按钮时使用jquery将div作为第一个元素添加
<div id='parent-div'>
<!--insert element as a first child here ...-->
<div class='child-div'>some text</div>
<div class='child-div'>some text</div>
<div class='child-div'>some text</div>
</div>
我想在每次单击按钮时使用jquery将div作为第一个元素添加
<div id='parent-div'>
<!--insert element as a first child here ...-->
<div class='child-div'>some text</div>
<div class='child-div'>some text</div>
<div class='child-div'>some text</div>
</div>
Answers:
尝试该$.prepend()
功能。
$("#parent-div").prepend("<div class='child-div'>some text</div>");
var i = 0;
$(document).ready(function () {
$('.add').on('click', function (event) {
var html = "<div class='child-div'>some text " + i++ + "</div>";
$("#parent-div").prepend(html);
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="parent-div">
<div>Hello World</div>
</div>
<input type="button" value="add" class="add" />
parentNode.insertBefore(newChild, refChild)
在现有子节点refChild之前,将节点newChild作为parentNode的子节点插入。(返回newChild。)
如果refChild为null,则将newChild添加到子级列表的末尾。等效地,更可读地,使用parentNode.appendChild(newChild)。
parentElement.prepend(newFirstChild);
这是(可能)ES7中的新增功能。现在是香草JS,可能是由于jQuery的流行。目前在Chrome,FF和Opera中可用。直到所有地方都可以使用它时,翻译员才能够处理它。
PS您可以直接在字符串前添加
parentElement.prepend('This text!');