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();

  })

})

猜你喜欢

转载自www.cnblogs.com/zj911005/p/8916678.html