ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScriptで要素テキストの内容を設定する方法

JavaScriptで要素テキストの内容を設定する方法

青灯夜游
リリース: 2023-01-05 16:11:36
オリジナル
7263 人が閲覧しました

テキスト コンテンツを設定する Javascript メソッド: 最初に「document.getElementById("id value")」ステートメントを使用してテキスト要素オブジェクトを取得し、次に「text element object.innerHTML='text content value'」を使用します。 ;" というステートメントを設定できます。

JavaScriptで要素テキストの内容を設定する方法

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

#JavaScript は要素テキストの内容を設定します

手順:

  • 要素の検索


  • innerHTML を使用してコンテンツを設定する


例:

<body>
    <p id="demo"></p>
    <script type="text/javascript">
        var x=document.getElementById("demo");  // 找到元素
        x.innerHTML="Hello JavaScript!";    // 设置内容
    </script>
    
</body>
ログイン後にコピー

出力:

JavaScriptで要素テキストの内容を設定する方法

説明:

innerHTML 属性は、テーブル行の開始タグと終了タグの間の HTML を設定または返します。

構文

tablerowObject.innerHTML=HTML
ログイン後にコピー

要素を検索するメソッド:

1. id に基づいて要素を取得

document.getElementById("id属性的值");
ログイン後にコピー

2. タグ名に基づいて要素を取得

document.getElementsByTagName("标签的名字");
ログイン後にコピー

3. name 属性の値に基づいて要素を取得

document.getElementsByName("name属性的值");
ログイン後にコピー

4. class 属性に基づいて要素を取得

document.getElementsByClassName("类样式的名字");
ログイン後にコピー

5. CSS に基づいて要素を取得パス (1 つ取得)

document.querySelector("css路径");
ログイン後にコピー

6. CSS パスに基づいて要素を取得 (グループを取得)

document.querySelectorAll("css路径");
ログイン後にコピー

[推奨学習:

JavaScript 上級チュートリアル ]

以上がJavaScriptで要素テキストの内容を設定する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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