Navigation:

1, insertBefore(), insertAfter(), prependTo(), appendTo() these four functions are almost the same in usage

2, In contrast, there are four functions: Before(),After(),prepend(),append()

1, jQuery.insertAfter() Detailed explanation of function(The other three refer to their usage)

##insertAfter() The function is used to insert all current matching elements after the specified element.

Relative to this function is the insertBefore() function, which is used to insert all current matching elements before the specified element .

jQuery object (instance).

jQueryObject.insertAfter( target )

is a string type, it is treated as a jQuery selector or html content string, jQuery I will make my own judgment. Return value

The return value of the functionisjQuery Type that returns a jQuery object representing the inserted content. Note: If the elements matched by the current jQuery object are certain elements in the current page, then these elements will

from their original positions. In short, this is equivalent to a move operation, not a copy operation. Example & Description

function is used to insert all matching elements into the specified element Position after :

段落文本1

段落文本2



 type="text/javascript">
$('').insertAfter( "p" );
// 其返回值就是匹配插入内容(两个注释元素'')的jQuery对象



段落文本1

段落文本2

function and the after() function:

var $A = $("s1");
var $B = $("s2");

// 将$A插入到$B之后
$A.insertAfter( $B ); // 返回表示插入内容的jQuery对象( 匹配所有$B之后插入的$A元素 )
// 将$B插入到$A之后
$A.after( $B ); // 返回$A

 id="n1">
     id="n2">span#n2    

 id="n3">
     id="n4" class="move">label#n4

 id="n5">
     id="n6">span#n6

Specific usage of the function:

// 将一个自定义的i元素插入到n4之后
$('i元素').insertAfter( "#n4" );

// 将n4插入到n2之后
// n4将从原位置上消失
$('#4').insertAfter( document.getElementById("n2") );

//将一个自定义的strong元素插入到每个span元素之后
$("插入文本").insertAfter( "span" );

##insertAfter()

closing tag , will not add any additional whitespace characters . The complete html code after the above code is executed is as follows (no adjustment to the format):

 id="n1">
     id="n2">span#n2插入文本    

 id="n3">
     id="n4" class="move">label#n4i元素

after()

insert specified content after each matching element. The specified content can be: html string, DOM element (or array), jQuery object, function (return value).

Relative to this function is the before() function, which is used to insert specified content before each matching element

This function belongs to the jQuery object (instance).

Syntax

jQueryObject.after( content1 [, content2 [, contentN ]] )

Parameters

段落文本1

段落文本2



 type="text/javascript">
$("p").after( '' ); 

var $A = $("s1");
var $B = $("s2");


// 将$B插入到$A之后
$A.after( $B ); // 返回$A
// 将$A插入到$B之后
$A.insertAfter( $B ); // 返回表示插入内容的jQuery对象( 匹配所有$B之后插入的$A元素 )

 id="n1">
     id="n2">span#n2    

 id="n3">
     id="n4">label#n4
     id="n5">i#n5

// 在n4之后插入一个自定义的span元素
$("#n4").after('span#n6(new)');

// 在n2之后插入n5
// n5将从原位置上消失
$("#n2").after( document.getElementById("n5") );

// 在每个span元素之后插入自定义的strong元素
$("span").after( function(index, innerHTML){
    return 'strong元素' + (index + 1) + '';
} );

 id="n1">
     id="n2">span#n2strong元素1 id="n5">i#n5    

 id="n3">
     id="n4">label#n4 id="n6">span#n6(new)strong元素2
    

The above is the detailed content of Detailed explanation of jquery's insertBefore(), insertAfter(), prependTo(), appendTo() usage. For more information, please follow other related articles on the PHP Chinese website!