首页 > 代码库 > 【学习笔记】锋利的jQuery(二)DOM操作

【学习笔记】锋利的jQuery(二)DOM操作

一、获取DOM节点

//找祖宗parent()parents()closest() //找后代children();find();//找兄弟next()/nextAll()prev()/prevAll()siblings()

二、元素节点操作

$(html)  //创建DOMappend()/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")  //默认单位pxoffset().left/top    position().left/topscrollTop()/scrollLeft()  //滚动条距离顶端、左边的距离

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

//无参数是获取,有参数设置为参数值html()text()  //元素的文本值val()    //当前默认值用defaultValue获取

 

【学习笔记】锋利的jQuery(二)DOM操作