jquery operates DOM elements (3)

.detach()
　　从DOM 中去掉所匹配的元素。
　　　　.detach([selector])
　　　　　　selector 一个选择表达式将需要移除的从匹配的元素中过滤出来。
　　　　$("p").detach();

 

.empty()
　　从DOM中移除集合中匹配元素的所有子节点。
　　　　.empty() 这个方法不接受任何参数。
　　结构：
　　　　

　　　　　　

Hello

　　　　　　

Goodbye

　　　　

　　　　$('.hello').empty();

　　效果：
　　　　

　　　　　　

　　　　　　

Goodbye

　　　　

.remove()
　　将匹配元素从DOM 中删除，同时删除元素上的事件。
　　.remove([selector])
　　　　selector 一个选择器表达式用来过滤将被移除的匹配元素集合。
　　结构：
　　　　

　　　　　　

Hello

　　　　　　

Goodbye

　　　　

　　　　$('.hello').remove();

　　效果：
　　　　

　　　　　　

Goodbye

　　　　

.unwrap()
　　将匹配元素集合的父级元素删除，保留自身，（和兄弟元素，如果存在）再原来的位置。
　　.unwrap()
　　　　这个方法不接受任何参数。
　　结构：
　　　　

　　　　　　

Hello

　　　　　　

Goodbye

　　　　

　　　　$('.hello').empty();

　　效果：
　　　　

Hello

　　　　

Goodbye

.replaceAll()
　　用集合的匹配元素替换每个目标元素。
　　.replaceAll(target)
　　　　target 一个选择器字符串，对象，DOM元素，或者元素数组，包含哪个元素被替换。
　　　　结构：

　　　　　　　　　　

Hello

　　　　　　　　　　

And

　　　　　　　　　　

Goodbye

　　　　　　

　　　　　　$('

New heading

').replaceAll('.inner');
　　　　效果：
　　　　　　

　　　　　　　　

New heading

　　　　　　　　

New heading

　　　　　　　　

New heading

　　　　　　

.replaceWith()
　　用提供的内容替换集合中所匹配的元素并返回删除元素的集合。
　　　　.replaceWith(newContent)
　　　　　　newContent 用来插入的内容，可能是HTML字符串，DOM元素，或者对象。
　　　　　　.replaceWith(function)
　　　　　　　　function 一个函数，返回的内容会替换匹配的元素集合。
　　　　　　结构：

　　　　　　　　　　

Hello

　　　　　　　　　　

And

　　　　　　　　　　

Goodbye

　　　　　　　　 

　　　　　　　　$('div.second').replaceWith('

New heading

');
　　　　　　效果：

　　　　　　　　　　　　

Hello

　　　　　

New heading

　　　div.third').replaceWith($( '.first'));
　　　 Effect:

　　　　　

And

　　　　　　

Hello< ;/div>
　　　　

The above is the content of jquery operating DOM elements (3). For more related articles, please pay attention to the PHP Chinese website (www.php.cn)!

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：jquery operates DOM elements (2)Next article：jquery operates DOM elements (2)

Related articles

See more

• An in-depth analysis of the Bootstrap list group component
• Detailed explanation of JavaScript function currying
• Complete example of JS password generation and strength detection (with demo source code download)
• Angularjs integrates WeChat UI (weui)
• How to quickly switch between Traditional Chinese and Simplified Chinese with JavaScript and the trick for websites to support switching between Simplified and Traditional Chinese_javascript skills