第III章オペレーティングJavaScriptのDOM

DOM:ドキュメントオブジェクトモデルドキュメントオブジェクトモデル
ドムカテゴリ:ドムコア; HTML DOM、CSSのドムは、



階層的なアクセスポイントに応じて:
parentNodeはノードの親を返し
のchildNodes子ノードによって返されたが、のchildNodesは、[I]は
のfirstChildは、ノードの最初の子ノードを返します。最も一般的な使用方法は、要素ノードのテキストにアクセスすることで
の最後の子ノードに戻りlastChild
次nextSiblingのノード
例えば、previousSiblingノードを
:解決ブラウザの互換性の問題を
firstElementChildは、最も一般的な使用の最初の子ノードを返し訪問していますテキストノード要素
lastElementChildは、最後の子ノードを返し
nextElementSibling次のノード
のノードpreviousElementSibling
例えば:oNext = oParent.nextElementSibling || oParent.nextSibling
ノード情報:
のnodeName:ノード名
のnodeValue:ノード値
のnodeType:ノードタイプを

オペレーションノード:
ノード・プロパティー:
のgetAttribute(「属性名」)
のsetAttribute(「属性名」、「属性値」)
ノードを作成し、挿入する:
はcreateElement(tagNameをが)のtagNameをノードという名前の新しい要素タグを作成
A.appendChild(B)をノードBは、エンドノードに追加され
たノードノードBに挿入する前のinsertBefore(B)
cloneNodeを(深い)指定されたノードをコピーする
ノードを削除して交換する:
のremoveChild(ノード)指定されたノードを削除するため
のreplaceChild(newNodeを他のノードとの置き換えの対象となるAttr oldNodeが)指定された属性
操作ノードパターン:
/ *スタイルプロパティ.style要素* /
関数whtmouseover(){
//作るHongtao小さなフォントの色、緑
のdocument.getElementById( "WHT") = .style.fontSize "15ピクセル"、
のdocument.getElementById( "WHT")style.color = "グリーン";
};
関数whtmouseout(){
//作るHongtao小さなフォントの色、緑
のdocument.getElementById(「WHT 「).style。fontSize = "8px"。
document.getElementById( "WHT")style.backgroundColor = "ピンク" ;.
};
/ *値を作成し、スタイルリストでスタイルの前.className .className * /要素と呼ばれる
(){関数lbmouseoverを
のdocument.getElementById( " "; LBとはLB ")クラス名を="
};
関数lbmouseout(){
のdocument.getElementById(" LBはLBOUT ")クラス名を=" ";
};

/ *第三の方法:要素.style.cssText =" CSSプロパティ値"* /
関数llmouseover(){
のdocument.getElementById(" LL ")色:赤、フォントサイズ:style.cssText =" 10pxの; ";
}
関数llmouseout(){
のdocument.getElementById(" LL「)。 style.cssText = "色:黒、フォント -size:60PX;"。
}
要素の属性:
offsetLeftは、読み取り専用属性、その親要素の左境界に左余白から現在の要素を返します
offsetTopは親要素の境界からの距離に現在の要素の境界線を返し、読み取り専用属性は、
要素の高さを返しoffsetHeight
offsetWidth幅素子返し
offsetParentのコンテナ要素がオフセット、を含む参照素子の即ち最近動的ポジショニング返し
scrollTopスプライトは、垂直スクロール位置合わせ要素が返さ
水平スクロール位置に一致する要素を返すscrollLeft
clientWidthリターン要素可視幅
要素の高さは、可視clientHeight返す
:要素の属性が適用さ
document.documentElement.scrollTopと、
document.documentElement.scrollLeft;
又は
document.body.scrollTop;
document.body.scrollLeft、


生産固定広告:
VaRのadver;
window.onload =関数(){
=のdocument.getElementByIdのadver( "adverが");
}
// onscroll:スクロールバーがトリガースクロールする
window.onscrollを=関数(){
//スクロールするスクロールバーのサイズ取得
するvar scorlltop = document.documentElement.scrollTop || document.bodyを。 scrollTopスプライト;
VAR = scorllleft document.documentElement.scrollLeft || document.body.scrollLeft。
//変更をスクロールバー要素従う
adver.style.top scorlltop = 30 + + "PX"を、
adver.style.left scorllleft = 10 + + "PX";
}

おすすめ

転載: www.cnblogs.com/ringqq/p/10980634.html