前端基础-jQuery节点操作

第10章 jQuery节点操作

10.1 创建节点

// $(htmlStr)
// htmlStr：html格式的字符串
$('<span-这是一个span元素</span-');

10.2 添加节点

append  appendTo		在被选元素的结尾插入内容   父.append(子)  子.appendTo(父)
prepend prependTo		在被选元素的开头插入内容   父.prepend(子) 子.prependTo(父)
before  insertBefore	在被选元素之后插入内容		后.before(前)  前.insertBefor(后)
after	insertAfter		在被选元素之前插入内容 	前.after(后)   后.insertAfter(前)

10.3 清空节点与删除节点

• empty：清空指定节点的所有元素，自身保留(清理门户)

$('div').empty(); // 清空div的所有内容（推荐使用，会清除子元素上绑定的事件）
$('div').html('');// 使用html方法来清空元素，不推荐使用，绑定的事件不会被清除。

• remove：相比于empty，自身也删除（自杀）

$('div').remove();

10.4 克隆节点

• 作用：复制匹配的元素

// 复制$(selector)所匹配到的元素（深度复制）
// cloneNode(true)
// 返回值为复制的新元素，和原来的元素没有任何关系了。即修改新元素，不会影响到原来的元素。
$(selector).clone();//克隆元素本身及后代
$(selector).clone(true);//克隆元素本身及后代以及绑定的事件