课堂上的代码：
http://js.jirengu.com/binuwigera/1/edit?html,js,output
http://js.jirengu.com/govatixevu/1/edit?js,output
http://js.jirengu.com/menosegapu/1/edit?js,output
封装一个函数
function getSiblings(node){}
再封装一个
function addClass(node, classes){}
命名空间
var dom = {}
dom.getSiblings(node)
dom.addClass(node, {a: true, b: false})
能不能把 node 放在前面
node.getSiblings()
node.addClass()
方法一：扩展 Node 接口
直接在 Node.prototype 上加函数-
方法二：新的接口 BetterNode
function Node2(node){ return { element: node, getSiblings: function(){ }, addClass: function(){ } } } let node =document.getElementById('x') let node2 = Node2(node) node2.getSiblings() node2.addClass()
第二种叫做「无侵入」。
把 Node2 改个名字吧
function jQuery(node){
return {
element: node,
getSiblings: function(){
},
addClass: function(){
}
}
}
let node =document.getElementById('x')
let node2 =jQuery(node)
node2.getSiblings()
node2.addClass()
再给个缩写吧 alias
window.$ = jQuery
改进一：改掉 document.getElementById
改进二：接受多个 node
改进三：添加 .html() .text() .css() 等
jQuery 不过如此？
- jQuery 在兼容性方面做得很好，1.7 版本兼容到 IE 6
- jQuery 还有动画、AJAX 等模块，不止 DOM 操作
- jQuery 的功能更丰富
- jQuery 使用了 prototype，我们没有使用，等讲了 new 之后再用
不过你已经了解 jQuery 了
