Home > Web Front-end > JS Tutorial > body text

Example analysis of replaceAll() method in jQuery

黄舟
Release: 2017-12-05 09:36:25
Original
1443 people have browsed it

Many friends may not understand what replaceAll means when they see the title. The replaceAll() function is used to replace all target elements with the current matching element. Today we will give you a detailed introduction to jQuery replaceAll() method in !

ThereplaceAll() function is used to replace all target elements with the current matching element.

This function belongs to the jQuery object (instance).

Syntax

jQuery 1.2 Added this function.

jQueryObject.replaceAll( target )

Parameters

Parameters Description
target String/Element/jQuery/Array type target element to be replaced, these elements will be replaced by the current matching element.

If the parameter target is a string, it will be treated as a jQuery selector.

Return value

replaceAll()The return value of the function is of jQuery type and returns a jQuery object representing the replacement content.

All data and event handlers associated with the replaced node will also be removed.

Note: If an element matched by the current jQuery object is an element on the page, the element will disappear from its original position. This is equivalent to a move operation, not a copy operation.

Example & Description

The replaceAll() function is used to replace all target elements with the current matching element:

<p>段落文本1<span></span></p>
<p>段落文本2<span></span></p>
<script type="text/javascript">
$(&#39;<em></em>&#39;).replaceAll( "p" );
// 其返回值就是匹配替换内容(两个&#39;<em></em>&#39;)的jQuery对象
</script>
<!--以下是jQuery代码执行后的html内容-->
<em></em>
<em></em>
Copy after login

Please note that the replacementAll() and replaceWith() functions The difference between:

var $A = $("s1");
var $B = $("s2");
// 将$B替换成$A
$A.replaceAll( $B ); // 返回表示替换内容的jQuery对象( 匹配替换掉$B的所有$A元素 )
// 将$A替换成$B
$A.replaceWith( $B ); // 返回$A
Copy after login

Please refer to the following HTML code (original HTML code):

<p id="n1">
    <span id="n2">foo</span>    
</p>
<p id="n3">
    <label id="n4">[label#n4]</label>
    <span id="n5">bar</span>
</p>
<div id="n6"></div>
Copy after login

The following jQuery sample code is used to demonstrate the specific usage of the replaceAll() function:

// 用em元素替换掉所有的span元素
$(&#39;<em class="new">替代元素</em>&#39;).replaceAll( "span" );
// 用n4替换掉n6
// n4将从原位置上消失(替换到n6的位置)
$("#n4").replaceAll( $("#n6") );
Copy after login

Run the code

The following is the html content after the jQuery code is executed (the format has not been adjusted):

<p id="n1">    
<em class="new">替代元素</em>    
</p><p id="n3">        
<em class="new">替代元素</em>
</p>
<label id="n4">[label#n4]</label>
Copy after login

Summary:

Through the detailed study of this article, I believe that many friends have a certain understanding and understanding of the replaceAll() method in jQuery. I hope it will be helpful to your work!

Related recommendations:

##jQuery.replaceAll() function example detailed explanation

Use replace combined with regular expressions in JavaScript to achieve the effect of replaceAll

Detailed explanation of the usage of js replace and replaceall instances

js uses regular expressions to implement ReplaceAll replacement method

The above is the detailed content of Example analysis of replaceAll() method in jQuery. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
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
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!