首页
学习
活动
专区
圈层
工具
发布

前端基础-jQuery节点操作

第10章 jQuery节点操作

10.1 创建节点

代码语言:javascript
复制
// $(htmlStr)
// htmlStr:html格式的字符串
$('<span-这是一个span元素</span-');

10.2 添加节点

代码语言:javascript
复制
append  appendTo		在被选元素的结尾插入内容   父.append(子)  子.appendTo(父)
prepend prependTo		在被选元素的开头插入内容   父.prepend(子) 子.prependTo(父)
before  insertBefore	在被选元素之后插入内容		后.before(前)  前.insertBefor(后)
after	insertAfter		在被选元素之前插入内容 	前.after(后)   后.insertAfter(前)

10.3 清空节点与删除节点

  • empty:清空指定节点的所有元素,自身保留(清理门户)
代码语言:javascript
复制
$('div').empty(); // 清空div的所有内容(推荐使用,会清除子元素上绑定的事件)
$('div').html('');// 使用html方法来清空元素,不推荐使用,绑定的事件不会被清除。
  • remove:相比于empty,自身也删除(自杀)
代码语言:javascript
复制
$('div').remove();

10.4 克隆节点

  • 作用:复制匹配的元素
代码语言:javascript
复制
// 复制$(selector)所匹配到的元素(深度复制)
// cloneNode(true)
// 返回值为复制的新元素,和原来的元素没有任何关系了。即修改新元素,不会影响到原来的元素。
$(selector).clone();//克隆元素本身及后代
$(selector).clone(true);//克隆元素本身及后代以及绑定的事件
举报
领券