JavaScript で innerHTML を使用する方法-jsチュートリアル-php.cn

JavaScript で innerHTML を使用する方法

不言

リリース： 2018-12-26 16:12:05

オリジナル

37476 人が閲覧しました

innerHTML 属性を使用すると、HTML 要素の内容を変更できます。テーブル行の開始タグと終了タグの間に HTML を設定または返すことができます。この記事では、その使用方法を紹介します。 innerHTML を見てみましょう。具体的な内容を見てみましょう。

JavaScript で innerHTML を使用する方法で innerHTML を使用する方法で innerHTML を使用する方法

#innerHTML の書き方

要素には、innerHTML で指定した要素名を設定します。

element.innerHTML;

ログイン後にコピー

指定した要素のhtmlコードを変数に代入

以下のように書くことで、指定した要素のhtmlコードを変数sample1に代入します

var sample1 = element.innerHTML;

ログイン後にコピー

変数の値を指定した要素に置き換えます

以下のように書くと、変数sample2の内容を削除した上で、element要素に変数sample2の内容を表示することができます。要素要素。

element.innerHTML = sample2;

ログイン後にコピー

指定要素のクリア

「」を指定すると要素要素の内容をクリアできます。

element.innerHTML = “”;

ログイン後にコピー

innerHTML の使用例を具体的に見てみましょう

基本的なコードは次のとおりです

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
</head>
<body>
<div id="txt">
      <div id="txt1">文字内容1 </div>
      <span id="txt2">文字内容2 </span>
    </div>
    <p>---------------------</p>
    <div id="innerHTMLtxt"></div>
</body>
</html>

ログイン後にコピー

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

##innerHTML 属性を使用した結果を見てみましょう JavaScript で innerHTML を使用する方法で innerHTML を使用する方法で innerHTML を使用する方法 #

<script type="text/javascript">
		innerHTMLtxt.innerHTML="php中文网！";
	</script>

ログイン後にコピー

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

#次に、innerHTML を使用して要素をクリアするコードを見てみましょう

<script>
  txt.innerHTML="";
</script>

ログイン後にコピー

実行結果は次のとおりです JavaScript で innerHTML を使用する方法で innerHTML を使用する方法で innerHTML を使用する方法

この記事はここで終わります。続きを読むエキサイティングなコンテンツについては、php 中国語 Web サイトの関連コラムに注目してください。！！

JavaScript で innerHTML を使用する方法

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