関数をカプセル化し、classNameを使用して要素を取得する方法
1307 ワード
classNameによる要素の取得
classNameでサブエレメントのスタイル、古いルールを変更します.ここではulliでJavaScriptセクションを例に挙げます.
Bodyセクション
注意:上記の方法ではbodyのすべてのclassの要素を取り出すことはできません
パッケージング関数
注意:カプセル化関数の実際の手順は、要素を取得することです.変更する要素のスタイルをフィルタします.配列に追加します.配列を返します.
classNameでサブエレメントのスタイル、古いルールを変更します.ここではulliでJavaScriptセクションを例に挙げます.
window,onload=function(){
var oUl=document.getElementById('ul1'); // ul
var oLi=oUl.getElementsTagName('li');
for(var i=0;i< oLi.length;i++){
if(aLi[i].className=='box'){
aLi[i].style.backgroundColor='red';
}
}
}
Bodyセクション
-
-
-
-
注意:上記の方法ではbodyのすべてのclassの要素を取り出すことはできません
パッケージング関数
function getClass(oParent,oClass){
var result=[]; // , class
var aEla=oParent.getElementTagName('*'); // body * ,
for(var i=0;i<aEla.length;i++){
if(aEla[i].className==oClass){
result.push(aEla[i]); // push
}
}
return result; // result
}
window.onload=function(){
var oUl=document.getElementById('ul1');
var oBox=getClass(oUl,'box');
for(var i=0;i<oBox.length;i++){
oBox[i].style.backgroundColor='red';
}
}
注意:カプセル化関数の実際の手順は、要素を取得することです.変更する要素のスタイルをフィルタします.配列に追加します.配列を返します.