jquery在一个元素后追加标签利⽤Jquery实现动态增加、修改html元素在jq中实现动态增加、修改元素有六种⽅法可以使⽤。
append 插⼊在当前元素内、最后⼀个⼦节点后⾯
prepend 插⼊到当前元素内、第⼀个⼦节点前⾯
after 在元素后⾯追加,同级 m.after(n); 在m后⾯追加n
before 在元素的前⾯追加,同级 m.before(n) 在m前⾯追加n
insertAfter 在元素后⾯追加,同级 m.insertAfter(n) 在n后⾯追加m 、把m插在n后⾯
insertBefore 在元素的前⾯追加,同级 m.insertBefore(n) 在n前⾯追加m、把m插在n前⾯
例如、如下html代码为前提
<div id="nameDiv">
<input type="text" id="name" name="name" placeholder="名称" /><br/><br/>
<input type="text" id="sex" name="sex" placeholder="性别" /><br/><br/>
</div>
<br/>
<label>--------div分割--------</label><br/><br/>
<div id="classDiv">
<input type="text" id="class" name="class" placeholder="班级" /><br/><br/>
<input type="text" id="phone" name="phone" placeholder="⼿机" /><br/><br/>
</div>
<br/><br/>
<input type="button" id="add" name="add" value="追加" οnclick="add()"/>
append 、prepend
function add() {
var addHtml = '<br/><br/><input type="text" id="code" name="code" placeholder="学号" /><br/><br/>';
$("#nameDiv").append(addHtml);
$("#classDiv").prepend(addHtml);
}
结果:
insertAfter、insertBefore的参数应该是html中已存在的元素
function add() {
$("#nameDiv").insertAfter($("#classDiv")); }
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论