jqueryでのappend()とappendto()の使用法に関する分析

巴扎黑
リリース: 2017-06-24 11:24:00
オリジナル
1791 人が閲覧しました

この記事では主に jquery の append() と appendto() の使用法を紹介します 必要な方は、jquery の append() と appendto() の具体的な構文と詳細な使用法を分析します。参考にしてください

この記事では、jquery での append() と appendto() の使用法を例とともに分析します。皆さんの参考に共有してください。具体的な分析は次のとおりです。

jQuery のドキュメント操作メソッドでは、append() メソッドと appendto() メソッドは同じタスクを実行しますが、この 2 つには違いもあります。

1. append() メソッド: 指定されたコンテンツを選択した要素の末尾に挿入します (ただし要素の内部にあります)。

a. 構文:

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

$(selector).append(content);

このうち、パラメータ content は必須であり、追加する内容を指定します。

b、append は、関数を使用して、選択した要素にコンテンツを追加できます。

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

$(selector).append(function(index,html));

ここで、function() は必須であり、パラメータのindexとhtmlはオプションです。 Index は受信セレクターのインデックス位置を表し、html は受信セレクターの現在の HTML を表します。

例:

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

<html>  
<head>  
<script type="text/
javascript
" src="/jquery/jquery.js"></script>  
<script type="text/javascript">  
$(
document
).ready(function(){  
  $("button").click(function(){  
    $("p").append(" <b>Hello jQuery!</b>");  
  });  
});  
</script>  
</head>  
<body>  
<p>This is a paragraph.</p>  
<p>This is another paragraph.</p>  
<button>在每个 p 元素的结尾添加内容</button>  
</body>  
</html>
ログイン後にコピー

実行結果は次のとおりです:

これは、こんにちは jQuery!
これは別の段落です。メソッド:

選択時 指定されたコンテンツを要素の最後に挿入します (ただし、要素の内部にはまだあります)。ただし、関数を使用してコンテンツを追加することはできません。

文法:

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

$(content).appendto(selector);

例:

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

<html>  
<head>  
<script type="text/javascript" src="/jquery/jquery.js"></script>  
<script type="text/javascript">  
$(document).ready(function(){  
  $("button").click(function(){  
    $("<b> Hello jQuery!</b>").appendTo("p");  
  });  
});  
</script>  
</head>  
<body>  
<p>This is a paragraph.</p>  
<p>This is another paragraph.</p>  
<button>在每个 p 元素的结尾添加内容</button>  
</body>  
</html>
ログイン後にコピー

実行結果は次のとおりです:

これは jQuery です!
これは jQuery です!

以上がjqueryでのappend()とappendto()の使用法に関する分析の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!