dom
DOM:ドキュメントオブジェクトモデル。
ノード
要素ノード:DOMの原子は要素ノードです。 <body>、<p>、<ul>などの要素は、他の要素を含めることができます。他の要素に含まれていない唯一の要素は<html>要素です
テキストノード:XHTMLドキュメントでは、テキストノードが常に要素ノード内に含まれています。
属性ノード:属性ノードは、要素のより具体的な説明を提供するために使用されます。たとえば、ほぼすべての要素にはタイトル属性があり、この属性を使用して、要素に含まれるものを正確に説明できます。
<p>このようなものを購入することを忘れないでください。</p>
DOMでは、title = "A Gentle Reminder"は属性ノードです。
CSS
要素を取得します
GetElementById、getElementsByTagname、getElementsByClassName要素ノードを取得する3つのメソッド。
getElementsByTagnameを使用すると、ワイルドカードをパラメーターとして許可します。つまり、ドキュメント内の各要素には、アレイに関数が返される場所があります。 WildCards( "*")は、乗算操作とは異なる引用符である必要があります。
getElementByIDおよびgetElementsByTagnameを使用することもできます。以下に示すように:
コードコピーは次のとおりです。
var Shopping = document.getElementById( "購入");
var items = Shopping.getElementsByTagname( "*");
これにより、ID属性値の購入が含まれる要素の数を取得できます。
GetElementsByClassNameメソッドは、新しいブラウザによってのみサポートされています。これを補うために、DOMスクリプトプログラマーは、既存のDOMメソッドを使用して独自のGetElementsByClassNameを実装する必要があります。ほとんどの場合、それらの実装プロセスは、次のgetelementsbyに類似しています。
コードコピーは次のとおりです。
function getElementsByClassName(node、className){
if(node.getElementsByClassName){
node.getElementsByClassName(className);
}それ以外{
var results = new array();
var elems = node.getElementsByTagname( "*");
for(var i = 0; i <elems.length; i ++){
if(elems [i] .classname.indexof(classname)!= -1){
結果[results.length] = elems [i];
}
}
結果を返します。
}
}
GetElementsByClassName関数は、2つのパラメーターを受け入れます。最初のノードは、DOMツリーの検索の開始点を表し、2番目のクラス名は検索するクラス名です。
プロパティを取得して設定します
getAttributeは、1つのパラメーターのみを備えた関数です - クエリを計画している属性の名前:
コードコピーは次のとおりです。
object.getAttribute(属性)
setAttribute()を使用すると、属性ノードの値を変更できます。 SetAttributeを使用してドキュメントを変更した後、ブラウザのビューソースオプションを介してドキュメントのソースコードを表示すると、以前のプロパティ値、つまりSetattributeによって作成された変更は、ドキュメント自体のソースコードに反映されません。 「内側と外側の一貫性のない」というこの現象は、DOMの動作モードからのものです。最初にドキュメントの静的コンテンツをロードし、次に動的に更新すると、ダイナミックリフレッシュはドキュメントの静的コンテンツに影響しません。これがDOMの本当のパワーです。ブラウザのページを更新せずにページコンテンツを更新します。