被jQuery宠坏了我现在包括它到每个项目,即使我需要它是调用$(“#div).hide()或$(”#link“)。click()一次。
我知道jQuery经常为你处理跨浏览器问题,但有时它只是一个方便的包装器的本地JavaScript方法。
所以我的问题是哪些jQuery方法可以很容易地替换为本机JavaScript?
解决方法
下面是我使用的一些例子,而不是jQuery方法(如果我不使用jQuery):
> $(node).css(values):
function css(node,style) { if(node && node.style) { for(var key in style) { node.style[key] = style[key]; } } }
> $(node).show():jQuery在这里更复杂,因为它也可以将显示值设置为。一致。
function show(node) { if(node && node.style) { node.style.display = ""; } }
> $(node).hide():此外,jQuery方法存储先前的显示值。
function hide(node) { if(node && node.style) { node.style.display = "none"; } }
> $(node).addClass(class)
function addClass(node,cls) { if(node) { if(!node.className) { node.className = cls; } else if(node.className.indexOf(cls) == -1) { node.className = node.className + " " + cls; } } }
> $(node).removeClass(class)
function removeClass(node,cls) { if(node && node.className && node.className.indexOf(cls) >= 0) { var pattern = new RegExp('\\s*' + cls + '\\s*'); node.className = node.className.replace(pattern,' '); } }
这些方法应该跨浏览器兼容。 jQuery方法通常提供更多选项,如删除多个类,或更复杂。
这取决于您的需要,无论您是否需要“高级”功能。更简单的方法可能就足够了。例如,如果我知道我总是要隐藏div元素,这hide和show方法是非常确定。
更新:
根据您正在开发的浏览器(例如,制作Firefox扩展),您甚至可以获得一些close到jQuery的选择器引擎:document.querySelectorAll(selector)