jqueryを使用してタグ内のコンテンツを置き換える方法-フロントエンドQ&A-php.cn

jqueryを使用してタグ内のコンテンツを置き換える方法

WBOY

リリース： 2022-01-14 11:24:12

オリジナル

4247 人が閲覧しました

jquery では、html() メソッドを使用してタグ内のコンテンツを置き換えることができます。このメソッドの機能は、選択された要素のコンテンツを返すか、設定することです。パラメータを設定せずにこのメソッドを使用する場合、選択した要素が返されます。要素の現在のコンテンツ、構文は「$(element).html("new content")」です。

jqueryを使用してタグ内のコンテンツを置き換える方法

このチュートリアルの動作環境: Windows10 システム、jquery3.2.1 バージョン、Dell G3 コンピューター。

jquery が tag 内のコンテンツを置換する方法

html() メソッドは、選択された要素 (内部 HTML) のコンテンツを返すか設定します。

このメソッドがパラメータを設定しない場合、選択された要素の現在のコンテンツを返します。

要素の内容を返す

このメソッドを使用して値を返す場合、最初に一致した要素の内容が返されます。

構文

$(selector).html()

ログイン後にコピー

要素の内容を設定

このメソッドを使用して値を設定すると、一致するすべての要素の内容が上書きされます。

構文

$(selector).html(content)

ログイン後にコピー

content オプション。選択した要素の新しいコンテンツを指定します。このパラメータには HTML タグを含めることができます。

関数を使用して要素のコンテンツを設定します

関数を使用して、一致するすべての要素のコンテンツを設定します。

Syntax

$(selector).html(function(index,oldcontent))

ログイン後にコピー

function(index,oldcontent) は、選択した要素の新しいコンテンツを返す関数を指定します。

index - オプション。セレクターのインデックス位置を受け取ります。

oldcontent - オプション。セレクターの現在の内容を受け取ります。

例は次のとおりです。

<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $(".btn1").click(function(){
    $("p").html("这是<b>新的</b>内容");
  });
});
</script>
</head>
<body>
<p>这是旧的内容</p>
<p>这也是旧的内容</p>
<button class="btn1">改变 p 元素的内容</button>
</body>
</html>

ログイン後にコピー

出力結果:

jqueryを使用してタグ内のコンテンツを置き換える方法