jQuery函数学习

函数:after(content)
功能:在每个匹配的元素后面添加html内容
返回:jQuery对象
参数:content (<Content>): Content to insert after each target.
例子:
Inserts some HTML after all paragraphs.

jQuery Code
$("p").after("<b>Hello</b>");
Before
<p>I would like to say: </p>
Result:
<p>I would like to say: </p><b>Hello</b>

Inserts an Element after all paragraphs.

jQuery Code
$("p").after( $("#foo")[0] );
Before
<b id="foo">Hello</b><p>I would like to say: </p>
Result:
<p>I would like to say: </p><b id="foo">Hello</b>

Inserts a jQuery object (similar to an Array of DOM Elements) after all paragraphs.

jQuery Code
$("p").after( $("b") );
Before
<b>Hello</b><p>I would like to say: </p>
Result:
<p>I would like to say: </p><b>Hello</b>


函数:append(content)
功能:在每个匹配元素之内添加content内容
返回:jQuery对象
参数:content (<Content>): Content to append to the target
例子:
Appends some HTML to all paragraphs.

jQuery Code
$("p").append("<b>Hello</b>");
Before
<p>I would like to say: </p>
Result:
<p>I would like to say: <b>Hello</b></p>

Appends an Element to all paragraphs.

jQuery Code
$("p").append( $("#foo")[0] );
Before
<p>I would like to say: </p><b id="foo">Hello</b>
Result:
<p>I would like to say: <b id="foo">Hello</b></p>

Appends a jQuery object (similar to an Array of DOM Elements) to all paragraphs.

jQuery Code
$("p").append( $("b") );
Before
<p>I would like to say: </p><b>Hello</b>
Result:
<p>I would like to say: <b>Hello</b></p>


函数:appendTo(content)
功能:和append(content)类似,只不过是将前面匹配的元素添加到后面的元素内
返回:jQuery对象
参数:content (<Content>): Content to append to the selected element to.
例子:
Appends all paragraphs to the element with the ID "foo"

jQuery Code
$("p").appendTo("#foo");
Before
<p>I would like to say: </p><div id="foo"></div>
Result:
<div id="foo"><p>I would like to say: </p></div>


函数:before(content)
功能:在匹配元素之前添加内容
返回:jQuery对象
参数:content (<Content>): Content to insert before each target.
例子:
Inserts some HTML before all paragraphs.

jQuery Code
$("p").before("<b>Hello</b>");
Before
<p>I would like to say: </p>
Result:
<b>Hello</b><p>I would like to say: </p>

Inserts an Element before all paragraphs.

jQuery Code
$("p").before( $("#foo")[0] );
Before
<p>I would like to say: </p><b id="foo">Hello</b>
Result:
<b id="foo">Hello</b><p>I would like to say: </p>

Inserts a jQuery object (similar to an Array of DOM Elements) before all paragraphs.

jQuery Code
$("p").before( $("b") );
Before
<p>I would like to say: </p><b>Hello</b>
Result:
<b>Hello</b><p>I would like to say: </p>


函数:clone(deep)
功能:克隆dom元素
返回:jQuery对象
参数:deep (Boolean): (可选的) 是否克隆子节点及其自身
例子:
Clones all b elements (and selects the clones) and prepends them to all paragraphs.

jQuery Code
$("b").clone().prependTo("p");
Before
<b>Hello</b><p>, how are you?</p>
Result:
<b>Hello</b><p><b>Hello</b>, how are you?</p>


函数:empty()
功能:移除匹配元素的子节点
返回:jQuery对象
例子:
jQuery Code
$("p").empty()
Before
<p>Hello, <span>Person</span> <a href="#">and person</a></p>
Result:
[ <p></p>


函数:insertAfter(content)
功能:将匹配元素插入到content插入到之后
返回:jQuery对象
参数:Content to insert the selected element after
例子:
jQuery Code
$("p").insertAfter("#foo");
Before
<p>I would like to say: </p><div id="foo">Hello</div>
Result:
<div id="foo">Hello</div><p>I would like to say: </p>


函数:insertBefore(content)
功能:将匹配元素插入到content插入到之前
返回:jQuery对象
参数:Content to insert the selected element before.
例子:
jQuery Code
$("p").insertBefore("#foo");
Before
<div id="foo">Hello</div><p>I would like to say: </p>
Result:
<p>I would like to say: </p><div id="foo">Hello</div>


函数:prepend(content)
功能:与append相反,append是添加到匹配元素子节点之后,prepend是添加到匹配元素子节点之前
返回:jQuery对象
参数: Content to prepend to the target.
例子:
jQuery Code
$("p").prepend("<b>Hello</b>");
Before
<p>I would like to say: </p>
Result:
<p><b>Hello</b>I would like to say: </p>

jQuery Code
$("p").prepend( $("#foo")[0] );
Before
<p>I would like to say: </p><b id="foo">Hello</b>
Result:
<p><b id="foo">Hello</b>I would like to say: </p>

$("p").prepend( $("b") );
Before
<p>I would like to say: </p><b>Hello</b>
Result:
<p><b>Hello</b>I would like to say: </p>


函数:prependTo(content)
功能:将前面元素添加到后面元素子节点的前面
返回:jQuery对象
参数:content (<Content>): Content to prepend to the selected element to.
例子:
jQuery Code
$("p").prependTo("#foo");
Before
<p>I would like to say: </p><div id="foo"><b>Hello</b></div>
Result:
<div id="foo"><p>I would like to say: </p><b>Hello</b></div>


函数:remove(expr)
功能:移除匹配元素
功能:jQuery对象
参数:expr (String): (optional) A jQuery expression to filter elements by.
例子:
jQuery Code
$("p").remove();
Before
<p>Hello</p> how are <p>you?</p>
Result:
how are

jQuery Code
$("p").remove(".hello");
Before
<p class="hello">Hello</p> how are <p>you?</p>
Result:
how are <p>you?</p>


函数:wrap(html)
功能:对匹配元素用html包裹起来
返回:jQuery对象
参数:
例子:
jQuery Code
$("p").wrap("<div class='wrap'></div>");
Before
<p>Test Paragraph.</p>
Result:
<div class='wrap'><p>Test Paragraph.</p></div>


函数:wrap(elem)
功能:对指定元素用html包裹起来
参数:
例子:
jQuery Code
$("p").wrap( document.getElementById('content') );
Before
<p>Test Paragraph.</p><div id="content"></div>
Result:
<div id="content"><p>Test Paragraph.</p></div>

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值