2018-06-27 jq文档处理与jq对象属性操作

jQ文档处理：

　内部插入

　　A.append(B) ->把B后追加到A内部中

　　B.appendTo(A) ->把B后追加到A内部中

　　A.prepend(B) ->把B后追加到A内部中

　　B.prependTo(A) ->把B后追加到A内部中

　　以上方法会导致追加对象A位置的移动

　外部插入

　　A.after(B) -> 把B追加到A外部的后面，且为前插入

　　B.insertAfter(A) -> 把B追加到A外部的后面，且为前插入

　　A.before(B) -> 把B追加到A外部的前面，且为后插入

　　B.insertBefore(A) -> 把B追加到A外部的前面，且为后插入

　　追加之后AB成为兄弟关系

　包裹

　　A.wrap('<b></b>') -> 用b标签把A包围起来

　　$('h2').wrap('<b></b>') // <b><h2>abc</h2></b>

　　wrapAll('<b></b>') -> 用b标签把所有A包围起来

　　$('h2').wrapAll('<b></b>') //<b><h2>123</h2><h2>123</h2></b>

　　wrapInner('<b></b>') -> 用b标签把A的内容包围起来

　　$('h2').wrapInner('<b></b>') 　//<b><h2>123</h2></b>

　替换

　　$('p').replaceWith('<b>321</b>') -> 把所有的p标签用'<b>321</b>'来替换，改变p标签的内容

　　$('p').wrapInner('<b>321</b>') // <p>abc<p> -> <b>321</b>

　　$('<b>321</b>').replaceAll('p') -> 同上

　删除

　　empty() -> 删除内容

　　$('p').empty() //<p>321<p> -><p><p> 相当于$('p').html("");

　　remove() -> 删除整个标签，并返回本对象方便以后使用，连同绑定的事件一起删除

　　$('p').remove() //<p>321<p> -> null

　　detach() -> 删除整个标签，并返回本对象方便以后使用，之前绑定的事件不会删除

　　$('p').detach() //<p>321<p> -> null

　复制

　　clone() ->复制对象

　　clone(true) ->复制对象，并将绑定的事件一同复制

jq对象属性操作

　　属性

　　attr() -> 填写一个参数就是获取某属性值

　　attr({'src':'1.jpg'}) -> 赋值要用json格式

　　CSS类

　　addClass() -> 给对象增加一个类

　　removeClass() -> 移走一个类

　　toggleClass() -> 给对象添加一个类，之前有的话就移走，没有的话就添加

　　HTML代码

　　html() -> 获取对象内部的内容，相当于js中的innerHTML()

　　html(val) -> 赋值

　　文本

　　text() -> 获取对象内部的文本内容，相当于js中的textContent()

　　text(val) ->赋值

　　值

　　val() -> 获取表单对象的值，相当于js中的value()

　　val(val) ->赋值