Wir wissen, dass es drei Möglichkeiten gibt, Elemente in js dynamisch zu erstellen.
Zum Beispiel:
var str = $("<a href='http://www.jb51.net'>脚本之家</a>");
$("ul").append(str); //将动态创建的str元素追加到ul下面Knoten anhängen
in js Die Methoden zum Anhängen von Knoten sind appendChild (Knotenelement) und insertBefor (Knotenelement, Position). In jQuery wird
append nach dem letzten untergeordneten Knoten des übergeordneten Elements angehängt
prepend eingefügt in den ersten untergeordneten Knoten des übergeordneten Elements
danach wird nach dem Element angehängt, das Geschwisterelement
bevor wird vor dem Element angehängt, das Geschwisterelement
Der folgende Code funktioniert gut. Die Demo hängt Knoten an
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
div {
width: 200px;
height: 100px;
border: 1px solid red;
}
</style>
<script src="jquery-1.12.2.js"></script>
<script>
$(function () {
//注意：如果传进来的jQuery对象是页面中存在的元素，它会这个对象剪切，
// 所以我们会发现点击后，最下面的p标签被剪切了
var p1 = $("p");
$("#btn1").click(function () {
$("div").append(p1);
});
$("#btn2").click(function () {
$("div").prepend(p1);
});
$("#btn3").click(function () {
$("div").after(p1);
});
$("#btn4").click(function () {
$("div").before(p1);
});
});
</script>
</head>
<body>
<input type="button" id="btn1" value="btnAppend"/>
<input type="button" id="btn2" value="btnPrepend"/>
<input type="button" id="btn3" value="btnAfter"/>
<input type="button" id="btn4" value="btnBefore"/>
<div>div标签1</div>
<p>我要插队。。。</p>
</body>
</html>
