DOM 操作でよく使用される属性の概要_JavaScript スキル-jsチュートリアル-php.cn

DOM 操作でよく使用される属性の概要_JavaScript スキル

WBOY

リリース： 2016-05-16 16:09:59

オリジナル

1445 人が閲覧しました

1.DOM: ドキュメントオブジェクトモデル DOM (ドキュメントオブジェクトモデル) は、HTML ドキュメントにアクセスして処理するための標準メソッドを定義します。 DOM は、HTML ドキュメントを要素、属性、テキストを含むツリー構造 (ノードツリー) として表現します。

2. DOM の一般的に使用される属性

2.1 ID による要素の取得

(1) 文法:

コードをコピーしますコードは次のとおりです:

document.getElementById("id");

(2) 機能: ID は人の ID カードであり、ID を検索することでタグを見つけ、対応する操作を実行できます。

(3) 注: 書類の作成を忘れないでください。

2.2 innerHTML 属性

(1) 文法:

コードをコピーしますコードは次のとおりです:

Obgect.innerHTML="Hello World"

(2) 機能: 主に

タグ内の内容を取得または置換します。

(3) 例：

コードをコピーしますコードは次のとおりです:

<頭>

innerHTML

javascript

JavaScript は、単純なオブジェクトベースのイベント駆動型スクリプト言語であり、HTML ドキュメントに埋め込まれ、Web ページ上に動的な表示効果を生成し、ユーザーとの対話機能を実装します。

<スクリプトタイプ="text/javascript">
var mychar=document.getElementById("con");
document.write("Original title:" mychar.innerHTML "
"); //元の h2 タグの内容を出力します
mychar.innerHTML="Hello World!";
document.write("Modified title:" mychar.innerHTML); // 変更された h2 タグの内容を出力します

(4) 注: Object は、document.getElementById("ID") によって取得される要素など、取得される要素オブジェクトです。

2.3 HTML スタイルの変更

(1) 文法:

コードをコピーしますコードは次のとおりです:

オブジェクト.スタイル.プロパティ

(2) 機能: HTML スタイルを変更するために使用されます

(3) 例：

コードをコピーしますコードは次のとおりです:

JavaScript が大好きです

JavaScript を使用すると、Web ページに動的な効果を表示したり、ユーザーとのインタラクティブな機能を実装したりできます。

<スクリプトタイプ="text/javascript">
var mychar= document.getElementById("con");
Mychar.style.color="red";
Mychar.style.backgroundColor="#ccc";
Mychar.style.width="300px";

(4) 注: このメソッドを使用して変更できるプロパティには、色や高さなど、さまざまなスタイルがあります。プロパティの後にセミコロンを追加することを忘れないでください。

2.4 表示・非表示(display属性)

(1) 文法:

Object.style.display=value
(2) 機能: Web ページでは表示と非表示がよく見られます。これは表示属性

を使用して実現されます。

(3) 例：

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

(4) Note: The value of value is none and block, where none means not to display content, and block means to display content

2.5 className attribute

(1) Grammar:

Copy code The code is as follows:

Object.className=classname

(2) Function: 1. Get the class attribute of the element; 2. Specify a css style for an element in the web page to change the appearance of the element

　(3) Example:

Copy code The code is as follows:

className attribute

JavaScript enables web pages to display dynamic effects and implement interactive functions with users.

The above is the entire content of this article, I hope you all like it.