jQuery 节点操作 筛选二
节点操作
$ (content).method( target ) | $ (content).method( target ) | 操作 |
---|---|---|
before() | insertBefore() | 在目标元素前面插入内容 |
after() | insertAfter() | 在目标元素后面插入内容 |
append() | appendTo() | 在目标元素开始处插入内容 |
prepend() | preppendTo() | 在目标元素结尾处插入内容 |
replaceWidth() | replaceAll() | 在目标元素替换为内容 |
clone()
克隆元素clone() 会拷贝所有的子元素
clone( true )
深度克隆,会克隆事件empty()
清空元素内容remove()
删除元素及内容 ,会删除元素事件remove() 不带参数移除所有选中元素
remove( selector ) 带参数移除选择器匹配的选中元素
detach()
删除元素,并且会返回元素本身,且保留了事件
筛选二
parent()
offsetParent()
parents()
close()
parent()
-父级offsetParent()
-定位父级parents([selector])
-所有祖级parentsUntil(selector)
截止到~的父级 不包含起止closest ( selector )
-最近祖级,(包含自身!!)必须写入参数
prevAll()
/ prevUntil( selector )
—– 上截止到
prevAll( [selector] )
—所有的上兄弟节点
nextAll()
/ nextUntil( selector )
—– 上截止到
nextAll( [selector] )
—所有的下兄弟节点
slice( selector,end )
–把匹配元素集合缩减为指定的指数范围的子集
selector 基于 0 的整数值,指示开始选取元素的位置。
如果是负数,则指示从集合末端开始的偏移量。
end基于 0 的整数值,指示结束选取元素的位置。
如果是负数,则指示从集合末端开始的偏移量。
如果省略,则选取范围会在集合末端结束。
1 | $('li').slice(2, 4).css('background-color', 'red'); |
包装
wrap()
外包装
ele.wrap( selector ) selector 包在ele元素外面
12 | $('.box').wrap( $('<a>') ); //<a href=""> <div class="box">div</div></a> |
wrapInner()
内包装
ele.wrapInner( selector ) selector 包在ele元素里面
大专栏 jQuery 节点操作 筛选二12 | $('.box').wrapInner( $('<a>') );//<div class="box"> <a href=""> div </a> </div> |
wrapAll()
整体包装
ele.wrapAll(seletor) 把匹配的 ele 提取出来 ,然后用seletor 整体包装
unwrap()
移除包装
ele.unwrap(seletor) 移除ele的父级
toArray()
转为数组
可以吧jQuery对象转为真实数组
12345 | x=$("li").toArray() for (i=0;i<x.length;i++) { alert(x[i].innerHTML); } |
serialize()
数组串联
序列表表格内容为字符串,用于Ajax请求
12345678910111213141516 | <p id="results"><b>Results: </b> </p> <form> <select name="single"> <option>Single</option> <option>Single2</option> </select> <select name="multiple" multiple="multiple"> <option selected="selected">Multiple</option> <option>Multiple2</option> <option selected="selected">Multiple3</option> </select><br/> <input type="checkbox" name="check" value="check1"/> check1 <input type="checkbox" name="check" value="check2" checked="checked"/> check2 <input type="radio" name="radio" value="radio1" checked="checked"/> radio1 <input type="radio" name="radio" value="radio2"/> radio2 </form> |
12 | $('#results').append("<tt>" + $("form").serialize() + "</tt>");//Results: single=Single&multiple=Multiple&multiple=Multiple3&check=check2&radio=radio1 |
serializeArray()
数据串联成数组
序列化表格元素(类似’.serialize()’方法)返回JSON数据结构数据
注意:此方法返回的是JSON对象而非JSON字符串。需要使用插件或者第三方库进行字符串化操作
12345 | [ {name: 'firstname', value: 'Hello'}, {name: 'lastname', value: 'World'}, {name: 'alias'}, // this one was empty] |
相关推荐
EdwardSiCong 2020-11-23
85477104 2020-11-17
hhanbj 2020-11-17
81427005 2020-11-11
seoppt 2020-09-13
honeyth 2020-09-13
WRITEFORSHARE 2020-09-13
84483065 2020-09-11
momode 2020-09-11
85477104 2020-08-15
83510998 2020-08-08
82550495 2020-08-03
tthappyer 2020-08-03
84901334 2020-07-28
tthappyer 2020-07-25
TONIYH 2020-07-22
tztzyzyz 2020-07-20
83510998 2020-07-18
81463166 2020-07-17