【学习笔记】锋利的jQuery（二）DOM操作

一、获取DOM节点

//找祖宗

parent()

parents()

closest() 



//找后代

children();

find();



//找兄弟

next()/nextAll()

prev()/prevAll()

siblings()

二、元素节点操作

$(html)  //创建DOM



append()/appendTo()       //内部追加

prepend()/prependTo()     //内部前置

after()/insertAfter()     //后面插入

before()/insertBefore()   //前面插入（注意区分js的insertBefore）



replaceWith()/replaceAll()  //替换节点

wrap()      //单独包裹

wrapAll()   //整体包裹

wrapInner() //内部包裹

 两种删除节点方法

remove()  //仍可追加，但绑定的事件失效

detach()  //保留节点匹配的事件和方法

 其他

clone()/clone(true)   //true表示该元素的副本也有复制功能

empty()     //清空元素的所有后代节点

三、属性节点操作

//获取

attr("title") 

//设置

attr("title","test")

attr({ "title":"test",  "name":"hello" )}

//删除

removeAttr()

四、样式操作

//类操作，可同时操作多个类名

addClass()

removeClass()

toggleClass()

hasClass()  //返回布尔值，等同于is(".classname")



//CSS-DOM操作，但会出现在表现层，用class代替

css()   //用法同attr()，带引号，"-"用驼峰式替换

css("opacity","0~1")  //设透明度



height()/width()

height(100)/height("10em")  //默认单位px



offset().left/top    

position().left/top

scrollTop()/scrollLeft()  //滚动条距离顶端、左边的距离

五、获取和设置HTML、文本和值

//无参数是获取，有参数设置为参数值

html()

text()  //元素的文本值

val()   //当前默认值用defaultValue获取

 附：

is(selector)  //判断选择器的存在，返回布尔值