HTML 5--classList
1885 ワード
HTML 5はクラス名を操作する方法を追加し、すべての要素にclassList属性を追加することで、操作をより簡単かつ安全にすることができます.このclassList属性は、新しい集合型DOMTokenList【DOMタグリスト】の例である.他のDOM集合と同様に、DOMTokenListは、自分がどれだけの要素を含んでいるかを示すlength属性であり、各要素を取得するにはitem()メソッドを使用してもよいし、方拡散記号構文を使用してもよい.
このタイプは、次の方法も定義します.
add(value):指定した文字列値をリストに追加します.値が既に存在する場合は、追加しません.
contains(value):リストに所定の値が存在するかどうかを示し、存在する場合はtrueを返し、そうでない場合はfalseを返します.
remove(value):指定した文字列をリストから削除します.
toggle(value):リストに指定した値がすでに存在する場合は、削除します.リストに値が指定されていない場合は、追加します.
item()は、クラス名のインデックスとしてパラメータをサポートし、対応するクラス名を返します.
lengthプロパティ.要素クラス名の個数を表します.
ブラウザの互換性:
Chrome 8+
FF 3.6+
Opera 11.50+
Safari 5.1+
ある人が整理したこの文章は悪くない,足を踏み入れた.
http://zhangyaochun.iteye.com/blog/1473167
http://www.zhangxinxu.com/wordpress/2013/07/domtokenlist-html5-dom-classlist-%E7%B1%BB%E5%90%8D/
このタイプは、次の方法も定義します.
add(value):指定した文字列値をリストに追加します.値が既に存在する場合は、追加しません.
contains(value):リストに所定の値が存在するかどうかを示し、存在する場合はtrueを返し、そうでない場合はfalseを返します.
remove(value):指定した文字列をリストから削除します.
toggle(value):リストに指定した値がすでに存在する場合は、削除します.リストに値が指定されていない場合は、追加します.
<body class="a b c"></body>
document.body.classList;// ：["a", "b", "c"]
document.body.classList.add("c");// undefined
document.body.classList.add("d");// undefined
document.body.classList.contains("d");// true
document.body.classList.contains("e");// false
document.body.classList.remove（"d"）;// undefined
document.body.classList.toogle（"f"）;// ， "f"
document.body.classList.toogle（"f"）;// ， "f"
item()は、クラス名のインデックスとしてパラメータをサポートし、対応するクラス名を返します.
document.body.classList.item(0);// ：“a”lengthプロパティ.要素クラス名の個数を表します.
document.body.classList.length();// ：“3”ブラウザの互換性:
Chrome 8+
FF 3.6+
Opera 11.50+
Safari 5.1+
ある人が整理したこの文章は悪くない,足を踏み入れた.
http://zhangyaochun.iteye.com/blog/1473167
http://www.zhangxinxu.com/wordpress/2013/07/domtokenlist-html5-dom-classlist-%E7%B1%BB%E5%90%8D/