jQuery DOM

Posted 黄强

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jQuery DOM相关的知识,希望对你有一定的参考价值。

创建节点

var box = $(‘<div id="box">节点</div>‘); 创建一个节点
$(‘body‘).append(box); //将节点插入到<body>元素内部

插入节点

append(content) 向指定元素内部后面插入节点 content
append(function(index,html){}) 使用匿名函数向指定元素内部后面插入节点
appendTo(content) 将指定元素移入到指定元素 content 内部后面
prepend(content) 向指定元素 content 内部的前面插入节点
prepend(function(index,html){}) 使用匿名函数向指定元素内部的前面插入节点
prependTo(content) 将指定元素移入到指定元素 content 内部前面

外部插入节点方法

after(content) 向指定元素的外部后面插入节点
content after(function(index,html){}) 使用匿名函数向指定元素的外部后面插入节点
before(content) 向指定元素的外部前面插入节点 content
before(function(index,html){}) 使用匿名函数向指定元素的外部前面插入节点
insertAfter(content) 将指定节点移到指定元素 content 外部的后面
insertBefore(content) 将指定节点移到指定元素 content 外部的前面

包裹节点

wrap(html) 向指定元素包裹一层 html 代码
wrap(element) 向指定元素包裹一层 DOM 对象节点
wrap(function(index){}) 使用匿名函数向指定元素包裹一层自定义内容
unwrap() 移除一层指定元素包裹的内容
wrapAll(html) 用 html 将所有元素包裹到一起
wrapAll(element) 用 DOM 对象将所有元素包裹在一起
wrapInner(html) 向指定元素的子内容包裹一层 html
wrapInner(element) 向指定元素的子内容包裹一层 DOM 对象节点
wrapInner(function(index){}) 用匿名函数向指定元素的子内容包裹一层


节点操作
$(‘body‘).append($(‘div‘).clone(true)); 复制一个节点添加到 HTML 中
$(‘div‘).remove(); 直接删除 div 元素
$(‘div‘).detach(); 保留事件行为的删除
$(‘div‘).empty(); 删除掉节点里的内容

$(‘div‘).replaceWith(‘<span>节点</span>‘); 将 div 替换成 span 元素
$(‘<span>节点</span>‘).replaceAll(‘div‘); 同上


























以上是关于jQuery DOM的主要内容,如果未能解决你的问题,请参考以下文章

jQuery的9中构造函数

jQuery 遍历(上)

jquery遍历总结(转)

Python之路Day16前端知识篇之DomJQuery

jQuery整理笔记文件夹

55-前端-JavaScript