JQueryのtext()、html()、val()の違いは何ですか?

不言
リリース: 2019-03-30 09:21:22
転載
2254 人が閲覧しました

この記事では、JQuery の text()、html()、val() の違いについて説明します。一定の参考値があるので、困っている友人は参考にしていただければ幸いです。

定義と使用法

text() メソッドは、選択した要素のテキスト コンテンツを設定または返します。

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

nbsp;html>


<meta>
<meta>
<meta>
<script></script>
<title>Document</title>


<div>div有文本内容</div>
<div>
    div2内的文本
    <span>span内有文本内容</span>
</div>
<input>
<input>
<button></button>
<script>
    console.log($("#div1").text());
    console.log($("#div2").text());
    console.log($("#div2 span").text()) ;
    console.log($("#input1").text());
    console.log($("#input2").text());
    console.log($("#button1").text());
</script>

ログイン後にコピー

console print Results

JQueryのtext()、html()、val()の違いは何ですか?

text() はラベル内のテキスト コンテンツのみを出力することがわかります。これは、js

# の innerText メソッドと同じです。 ##定義と使用法

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

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

<div>div有文本内容</div>
<div>
    div2内的文本
    <span>span内有文本内容</span>
</div>
<input>
<input>
<button></button>
<script>
    console.log($("#div1").html());
    console.log($("#div2").html());
    console.log($("#div2 span").html());
    console.log($("#input1").html());
    console.log($("#input2").html());
    console.log($("#button1").html());
</script>
ログイン後にコピー
コンソールからの出力結果

JQueryのtext()、html()、val()の違いは何ですか?

現在のタグのテキスト内容を出力します。サブタグがある場合は、サブタグを結合します。タグ自体とテキストを一緒に印刷します。

これは js の innerHTML に似ています。

定義と使用法

val() メソッドは、選択された要素の値を返すか、設定します。

要素の値は、value 属性を通じて設定されます。このメソッドは主に入力要素に使用されます。

メソッドは主にフォーム要素の値を取得するために使用されます。

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

<div>div有文本内容</div>
<div>
    div2内的文本
    <span>span内有文本内容</span>
</div>
<input>
<input>
<button></button>
<script>
    console.log($("#div1").val());
    console.log($("#div2").val());
    console.log($("#div2 span").val());
    console.log($("#input1").val());
    console.log($("#input2").val());
    console.log($("#button1").val());
</script>
ログイン後にコピー
コンソールを介した結果の出力

JQueryのtext()、html()、val()の違いは何ですか?

val() は、フォームにデータを出力するために使用されます。 p タグとspanタグは同じではありません。出力されませんでした。H5の新しいタグのプレースホルダー

もテストしましたが、これも出力されませんでした。そのため、このvalはタグ##のvalue属性のみに使用する必要があります

#この記事はすべてここにあります。以上です。その他のエキサイティングなコンテンツについては、PHP 中国語 Web サイトの

jquery ビデオ チュートリアル

列に注目してください。

以上がJQueryのtext()、html()、val()の違いは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:segmentfault.com
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート