jQueryのinsertAfter()メソッドの使用例-jsチュートリアル-php.cn

jQueryのinsertAfter()メソッドの使用例

巴扎黑

リリース： 2017-06-24 13:25:33

オリジナル

1549 人が閲覧しました

この記事では、jQuery の insertAfter() メソッドの使用法を主に紹介し、insertAfter() メソッドの機能と定義を例とともに分析し、必要な方は、一致する要素を別の指定された要素コレクションに挿入する使用方法について説明します。参考にしてください

この記事の例では、jQuery での insertAfter() メソッドの使用方法について説明します。皆さんの参考に共有してください。具体的な分析は次のとおりです:

このメソッドは、別の指定された要素セットの後に一致する要素を挿入します。
insertAfter() メソッドは、insertBefore() メソッドとは逆の効果があります。

文法構造:

コードは次のとおりです:

$(selector).insertAfter(content)

パラメータリスト:

パラメータ	説明
selector	は、挿入されるコンテンツを定義します。
content	コンテンツを後に挿入する要素を定義します。

サンプルコード:

コードは次のとおりです:

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.jb51.net/" />
<title>insertAfter()
函数
-脚本之家</title> 
<style type="text/css"> 
p{ 
  width:100px; 
  height:100px; 
  border:1px solid red; 
} 
p{ 
  width:200px; 
  height:200px; 
  border:1px solid blue; 
} 
</style> 
<script type="text/
javascript
" src="mytest/jQuery/jquery-1.8.3.js"></script> 
<script type="text/javascript"> 
$(
document
).ready(function(){ 
  $("button").click(function(){ 
    $("p").insertAfter("p"); 
  }) 
}); 
</script> 
</head> 
<body> 
<p>我的前面会被插入内容</p> 
<p>我是p元素</p> 
<button>点击查看效果</button> 
</body> 
</html>

ログイン後にコピー

上記のコードは、p要素をp要素の下、もちろん外側の下に挿入できます。

以上がjQueryのinsertAfter()メソッドの使用例の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。