html5的確給我們帶來驚喜， 新增的dom api-類選擇器

那么怎樣使用呢？看下面的代碼吧.....

JavaScriptvar els = document.getElementsByClassName('myinput');

els[0].focus();多有意思的一個api，提供了豐富的用戶體驗！

看下面的小例子吧

XML/HTML

html5-DOM API

var els = document.getElementsByClassName('section');

els[0].focus();

通過類似 css 選擇器的語法定位元素 (Selectors API)

JavaScriptvar els = document.querySelectorAll("ul li:nth-child(odd)");var els = document.querySelectorAll("table.test > tr > td");

XML/HTML

html5-querySelectorAll

• 1
• 2
• 3
• 4
• 5
• 6

• 1
• 2
• 3
• 4
• 5
• 6

var els = document.querySelectorAll("ul li:nth-child(odd)");

for(var i =0; i

els.item(i).style.color="#f00";

其他的例子

XML/HTML

table

s	s	s	s
s	s	s	s
s	s	s	s
s	s	s	s

alert(els.length);

for(var i = 0; i

els.item(i).style.color="#f00";

總結

以上是生活随笔為你收集整理的HTML5中CLASS选择器,html5 class选择器的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。