回答
allItems = document.getElementsByTagName('*');
goodItems = [];
for(i=0;i<allItems.length;i++){
if(
allItems[i].className &&
(' '+allItems[i].className.replace(/\s+/g, ' ')+' ').indexOf(' '+'hover'+' ') != -1 &&
(' '+allItems[i].className.replace(/\s+/g, ' ')+' ').indexOf(' '+'selected'+' ') == -1
)
goodItems.push(allItems[i]);
}
如果你需要这些类型的类选择的时候,你应该考虑其另存为功能,甚至复制一些jQuery的行为才能够做的东西一样$(".hover").not(".selected");
'indexOf()'对于元素是否具有特定的类并且会产生误报不是一个好的测试。例如,具有'class =“foo_hover_bar”'的元素将通过此代码进行匹配。 – 2010-11-08 10:14:50
@Tim很好。谢谢。我更新了代码。 – 2010-11-08 10:18:21
仍然存在一个问题:在IE <9中这不适用,其中数组没有'indexOf()'方法。 – 2010-11-08 10:37:01
您还可以使用下面的函数来按类名获取元素。
excludeClass
这里是一个可选参数,如果你只定义includeClass
参数,这个函数仍然可以工作。
function getElementsByClassName(includeClass, excludeClass) {
var elements = []; var el = document.getElementsByTagName('*');
var regexp1 = new RegExp("\\b" + includeClass + "\\b");
var regexp2 = new RegExp("\\b" + (excludeClass ? excludeClass : "") + "\\b");
for (var i = 0; i < el.length; i++) {
if (regexp1.test(el[i].className) && !regexp2.test(el[i].className)) { elements.push(el[i]); }
}
return elements;
}
以下将工作。它可以通过使用原生浏览器实现getElementsByClassName()
进行优化,在该实现中,将列表过滤为仅具有“悬停”类的元素。
function hasClass(el, cssClass) {
return el.className && new RegExp("(^|\\s)" + cssClass + "(\\s|$)").test(el.className);
}
var matchingElements = [];
var allElements = document.getElementsByTagName("*");
for (var i = 0, len = allElements.length, el; i < len; ++i) {
el = allElements[i];
if (hasClass(el, "hover") && !hasClass(el, "selected")) {
matchingElements.push(el);
}
}
hasclass功能的+1 – meo 2010-11-08 10:35:47
@Alin:虽然没关系,因为它不是在正则表达式上分裂的。它检查该类是在开始处还是紧接在空白字符前面;该空白字符(如果存在)之前的内容是不相关的。检查课程结束的逻辑是相似的。 – 2010-11-08 11:51:19
你说得对。抱歉。 – 2010-11-08 11:53:02
- 1. 使用纯CSS的响应菜单,而不是JavaScript或jQuery的
- 2. 纯JavaScript,没有jquery的
- 3. jquery选择器的纯JavaScript对象,而不是DOM元素
- 4. 将纯Javascript改为JQuery
- 5. 在纯javascript中转换jquery
- 6. 将jQuery翻译为纯javascript
- 7. 纯JavaScript等于jquery $(this)
- 8. 将jquery转换为纯javascript
- 9. jQuery选择vs纯javascript
- 10. jQuery代码以纯JavaScript
- 11. 纯JavaScript/jQuery/HTML验证码
- 12. 在纯javascript中的jquery动画效果
- 13. 转换纯JavaScript函数jQuery的切换()
- 14. 使用纯javascript的动画,没有jquery
- 15. 转换.load(jQuery的),以纯JavaScript
- 16. jQuery的转换为纯JavaScript代码
- 17. 无论是使用jQuery的或纯JavaScript以淡入淡出和
- 18. 什么是这个jQuery选择器的纯JavaScript替代品?
- 19. 如何更新与纯JavaScript的iFrame的CSS不使用jQuery
- 20. :“是不是一个函数”以纯的JavaScript
- 21. 更改锚标记中使用纯javascript的图像源不是jquery
- 22. 点击具有特定“rel”的li:纯javascript,不jquery
- 23. 转换的jQuery $不用彷徨到纯JavaScript
- 24. java不是纯粹的OOP
- 25. 如何将JQuery转换为纯Javascript?
- 26. 如何将JavaScript转换为纯jQuery
- 27. 将代码从jquery转换为纯javascript
- 28. 将jquery脚本转换为纯javascript
- 29. jQuery:它是什么“禁止”在纯Javascript中做
- 30. 使用jQuery和纯Javascript是什么区别?
任何你不只是使用jQuery或其他框架的原因? – 2010-11-08 09:20:11
由于性能...我们使用raphael已经 – albuvee 2010-11-08 09:33:08
认识到jQuery是相当不错的优化,无论你写的代码是最有可能不会更有效。 – 2010-11-08 09:37:45