オペレーション属性とクラス
属性ノードの操作
テキストノードのコンテンツ取得と変更：
構文：（要素ノード、属性名）elementNode.attributeNameに
も使用することができ、「[]」（要素ノード[プロパティ名]）
注：一般的な我々の属性ノードで動作しているときの要素ノードを介して直接値（/改変）プロパティノードプロパティノードを取得するが、取得する必要はありません。
特に、いくつかの属性名jsのキーワードまたは予約語競合、およびだけ別の名前で：
クラス属性：クラス名（classキーワード）を書き込むに。
属性のラベルlabel：書かhtmlFor。
ノードのプロパティを操作する方法で：
element.getAttribute（attributeNameには）要素ノードの指定された属性値を返します。
element.setAttribute（attributeNameの、属性値）が設定又は指定された値に指定されたプロパティを変更します
element.removeAttribute（attributeNameの）要素から、指定された属性を削除します
ement.hasAttribute（attributeNameの）要素が指定されたプロパティを持つ場合、trueを返します
第二に、カスタムプロパティ
カスタム属性：HTMLタグは、プロパティの独自の定義を記述すること。
オブジェクトに属性を追加することは非常にシンプルですが、しかし、DOMで、ノードが要素のカスタム属性ノードに追加され、HTML5には、カスタム属性ノードは、「データ - 」から始まることが必要
たとえば、カスタムプロパティのABCは、のように記述する必要があります。
データ-ABCは
このように、データセットの属性によって動作させることができる使用されます。
たとえば、次のタグのカスタムプロパティ「ABC」
<a href="" data-abc='123'> </a>の <SCRIPT> せaEle = document.querySelector（ ''）。 console.log（aEle.dataset.abc）。// 123 </ SCRIPT>
注：この方法は、カスタム属性を含む任意の属性、動作させることができる関連付けられた属性（カスタムプロパティについては、「データ - 」を使用して追加する必要があります）
三の新しい操作、HTML5のクラス属性で
使用CLASSLISTは要素ノード上のすべてのクラスの値を取得します：
<BODY> 。<PのID = "TEST1"クラス= "ABCのQWE"> Loremのイプサム悲しみ座るAMET </ P> <スクリプト> せTEST1 =のdocument.getElementById（ "TEST1" ）。 console.log（test1.classList）。// DOMTokenList（2）[ "ABC"、 "QWE"、値"ABC QWE"] はconsole.log（test1.classList [0]）。// ABC にconsole.log（test1.classList [1]）。// QWE </スクリプト> </ BODY>
CLASSLIST関連するメソッド：
element.classList.add（クラス名）が値を追加するために、クラスの名前を指定します。
element.classList.remove（クラス名）指定されたクラス名の値を削除します
element.classList.contains（クラス名）が指定されたクラス名の値を決定します
element.classList.toggle（クラス名）指定された名前のスイッチングクラス値が削除され、全く加えません
オペレーティングスタイル
すべてのスタイルは文字列です。
まず、インラインスタイル
シングルスタイル：
element.style.styleName;
例：divEle.style.width = '200pxの';
element.style [styleName]に;.
例：divEle.style [ '幅'] = '200pxの'。
注：で、スタイル名「 - 」という名前を取り外して交換こぶ。
HTMLを学ぶ、より少ない時間CSSのインラインスタイルはほとんどの場合、したがって、この方法の使用は、CSSのjs操作をJSを残すために使用されている必要があり。
複数のスタイル：
ラインパターンの全体の文字列値element.style.cssTextへの直接アクセス（/変更）
例子：box.style.cssText = "高さ：100pxに、背景色：赤;";
注：このように基本的な適用。
第二に、スタイルシートのスタイル
（インラインおよびアウトリーチを含む）スタイルシート：
document.styleSheets [0] .rules [0] .style.backgroundColor = "青"。
styleSheets：スタイルシートアレイ（スタイルシートのスタイルタグ）;
ルール：すべてのルール・アレイ（「{}」ルールなど）、
従って意味：0番目のスタイルシート0番目のルールのbackgroundColor変更「青」。
注：この方法では基本的な必要性。
第三に、究極のスタイル
互換性の問題のために、そして最終的に書き込みの2つのスタイルがあります。
低バージョンすなわち、currentStyleとプロパティ：
element.currentStyle.styleName。
FirefoxとgetComputedStyleの方法により、（最近のブラウザ用）クロム：
getComputedStyle（要素）.styleName。
注：使用、必要に応じて、最終的に算出したスタイルは、読み取り専用、スタイルで、変更することはできません。
互換パッケージ：
関数でgetStyle（OBJ、名）{ IF（obj.currentStyle）{ // currentStyle [名前]を使用してIEブラウザ リターンobj.currentStyle [名]; } 他 { // FirefoxおよびクロムブラウザgetComputedStyle（OBJ、偽）は[名前] を返す（OBJ、getComputedStyleをfalseに）[名前]; } }
添加：要素ノードのサイズと位置を取得します
外形寸法：
ELement.clientWidth
ELement.clientHeightパディング+含量（黒ボックス）
ELement.offsetWidth
ELement.offsetHeight概要パディング+ +ボーダー（ボックス）
所在地：
ELement.offsetLeftの
ハウジングの位置ELement.offsetTop境界は、親要素の位置を基準として位置付け