jQuery Dom 操作,动态生成dom,绑定事件
1、获取内容 - text()、html()以及val()
text()-设置货返回所选的元素的文本内容;$("#text").text();
html()- 设置或返回所选元素的内容(包括HTML标记)$("#text").html();
val() - 设置货返回表单字段的值 $("#text").val();
attr() - 获取属性值 $("#text").attr(" href");
删除属性 $("ul li:eq(1)").removeAttr("title");
动态添加
.append() -- 在目标元素之后添加元素
.prepend() -- 在目标元素之前添加元素
.after() -- 在目标元素之后换行添加元素
.before() -- 在目标元素之前添加元素,并是目标元素换行
删除元素
.remove() -- 删除目标元素
.empty() -- 清除目标元素内的子元素
$(document).ready(function(){
$("#btn").on('click',function(){
var ele1 = '<p>come on</p>';
var ele2 = $("<p></p>").text("let's do it");
var ele3 = document.createElement("p");
ele3.innerHTML = "dance your body";
$(body).append(ele1,ele2,ele3);
});
/*删除元素*/
$("#btn").on('click',function(){
$("div").remove();
$("div").empty();
})
})
jQuery绑定事件
jQuery 中绑定事件一般使用bind,或者click,到那时这只能对已经加载好的元素定义事件,那些后来添加插入的元素则需要另行绑定。
jQuery 1.7 版以前使用live 动态绑定事件
$("#text ul lli").live("click",function(){
})
jquery 1.7 版以后使用on动态绑定事件
$("#text ul li").on("click","li",function(){
// do something here
})