本文共 6580 字,大约阅读时间需要 21 分钟。
获取标签 $(选择)。
创建一个标签对象 $("标签"); 由于所有的返回jQuery对象,能够调用链(无论jQuery API 回报jQuery对象)
參数
contentString, Element, jQueryV1.0要追加到目标中的内容
function(index, html)FunctionV1.4
返回一个HTML字符串,用于追加到每个匹配元素的里边。
接受两个參数,index參数为对象在这个集合中的索引值。html參数为这个对象原先的html值。
演示样例描写叙述:向全部段落中追加一些HTML标记。
HTML 代码:
<p>I would like to say: </p>jQuery 代码:$("p").append("<b>Hello</b>");结果: [ <p>I would like to say: <b>Hello</b></p> ]在jQuery 1.3.2中,appendTo, prependTo, insertBefore, insertAfter, 和 replaceAll这个几个方法成为一个破坏性操作,返回值是全部被追加的内容,而不不过先前所选中的元素。所以,要选择先前选中的元素,须要使用end()方法,參见例二。
參数
contentString用于被追加的内容
演示样例描写叙述:把全部段落追加到ID值为foo的元素中。
HTML 代码:
<p>I would like to say: </p> <div></div><div></div>jQuery 代码:$("p").appendTo("div");结果: <div><p>I would like to say: </p></div> <div><p>I would like to say: </p></div> 描写叙述:新建段落追加div中并加上一个class
HTML 代码:<div></div><div></div>
jQuery 代码: $("<p/>") .appendTo("div") .addClass("test") .end() .addClass("test2");结果:<div><p class="test test2"></p></div> <div><p class="test"></p></div>
prepend(content)
向每一个匹配的元素内部前置内容。 这是向全部匹配元素内部的開始处插入内容的最佳方式。參数
contentString, Element, jQueryV1.0要插入到目标元素内部前端的内容
function(index, html)FunctionV1.4
返回一个HTML字符串。用于追加到每个匹配元素的里边。
接受两个參数,index參数为对象在这个集合中的索引值。html參数为这个对象原先的html值。
演示样例描写叙述:向全部段落中前置一些HTML标记代码。HTML 代码:
<p>I would like to say: </p>jQuery 代码:$("p").prepend("<b>Hello</b>");结果: [ <p><b>Hello</b>I would like to say: </p> ] 描写叙述:将一个DOM元素前置入全部段落HTML 代码:
<p>I would like to say: </p> <p>I would like to say: </p> <b class="foo">Hello</b> <b class="foo">Good Bye</b>jQuery 代码:$("p").prepend( $(".foo")[0] );结果: <p><b class="foo">Hello</b>I would like to say: </p> <p><b class="foo">Hello</b>I would like to say: </p> <b class="foo">Good Bye</b> 描写叙述:向全部段落中前置一个jQuery对象(类似于一个DOM元素数组)。HTML 代码:
<p>I would like to say: </p><b>Hello</b>jQuery 代码:$("p").prepend( $("b") );结果: <p><b>Hello</b>I would like to say: </p>概述
把全部匹配的元素前置到还有一个、指定的元素元素集合中。 实际上,使用这种方法是颠倒了常规的$(A).prepend(B)的操作。即不是把B前置到A中,而是把A前置到B中。在jQuery 1.3.2中。appendTo, prependTo, insertBefore, insertAfter, 和 replaceAll这个几个方法成为一个破坏性操作,要选择先前选中的元素,须要使用end()方法,參见 appendTo 方法的例二。
參数
contentString用于匹配元素的jQuery表达式
演示样例描写叙述:把全部段落追加到ID值为foo的元素中。HTML 代码:
<p>I would like to say: </p><div id="foo"></div>jQuery 代码:$("p").prependTo("#foo");结果: <div id="foo"><p>I would like to say: </p></div>after(content|fn)
在每一个匹配的元素之后插入内容。
參数
contentString, Element, jQueryV1.0插入到每一个目标后的内容
functionFunctionV1.4
函数必须返回一个html字符串。
演示样例描写叙述:在全部段落之后插入一些HTML标记代码。HTML 代码:<p>I would like to say: </p>
jQuery 代码: $("p").after("<b>Hello</b>");结果:<p>I would like to say: </p><b>Hello</b> 描写叙述:在全部段落之后插入一个DOM元素。HTML 代码:
<b id="foo">Hello</b><p>I would like to say: </p>jQuery 代码:$("p").after( $("#foo")[0] );结果: <p>I would like to say: </p><b id="foo">Hello</b> 描写叙述:在全部段落中后插入一个jQuery对象(类似于一个DOM元素数组)。HTML 代码:
<b>Hello</b><p>I would like to say: </p>jQuery 代码:$("p").after( $("b") );结果: <p>I would like to say: </p><b>Hello</b>
插入到每一个目标后的内容
functionFunctionV1.4
函数必须返回一个html字符串。
演示样例描写叙述:在全部段落之前插入一些HTML标记代码。HTML 代码:
<p>I would like to say: </p>jQuery 代码:$("p").before("<b>Hello</b>");结果: [ <b>Hello</b><p>I would like to say: </p> ] 描写叙述:在全部段落之前插入一个元素。HTML 代码:
<p>I would like to say: </p><b id="foo">Hello</b>jQuery 代码:$("p").before( $("#foo")[0] );结果: <b id="foo">Hello</b><p>I would like to say: </p> 描写叙述:在全部段落中前插入一个jQuery对象(类似于一个DOM元素数组)。HTML 代码:
<p>I would like to say: </p><b>Hello</b>jQuery 代码:$("p").before( $("b") );结果: <b>Hello</b><p>I would like to say: </p>在jQuery 1.3.2中。appendTo, prependTo, insertBefore, insertAfter, 和 replaceAll这个几个方法成为一个破坏性操作,要选择先前选中的元素,须要使用end()方法。參见 appendTo 方法的例二。
參数
contentStringV1.0用于匹配元素的jQuery表达式
演示样例描写叙述:把全部段落插入到一个元素之后。与 $("#foo").after("p")同样HTML 代码:
<p>I would like to say: </p><div id="foo">Hello</div>jQuery 代码:$("p").insertAfter("#foo");结果: <div id="foo">Hello</div><p>I would like to say: </p>在jQuery 1.3.2中,appendTo, prependTo, insertBefore, insertAfter, 和 replaceAll这个几个方法成为一个破坏性操作,要选择先前选中的元素,须要使用end()方法。參见 appendTo 方法的例二。
參数
contentStringV1.0用于匹配元素的jQuery表达式
演示样例描写叙述:把全部段落插入到一个元素之前。与 $("#foo").before("p")同样。HTML 代码:
<div id="foo">Hello</div><p>I would like to say: </p>jQuery 代码:$("p").insertBefore("#foo");结果: <p>I would like to say: </p><div id="foo">Hello</div>HTML 代码:
<p>Hello, <span>Person</span> <a href="#">and person</a></p>jQuery 代码:$("p").empty();结果: <p></p>
但除了这个元素本身得以保留之外,其它的比方绑定的事件。附加的数据等都会被移除。
參数expr String
用于筛选元素的jQuery表达式
演示样例描写叙述:从DOM中把全部段落删除HTML 代码:
<p>Hello</p> how are <p>you?</p>jQuery 代码:$("p").remove();结果: how are 描写叙述:从DOM中把带有hello类的段落删除HTML 代码:
<p class="hello">Hello</p> how are <p>you?</p>jQuery 代码:$("p").remove(".hello");结果: how are <p>you?</p>与remove()不同的是,全部绑定的事件、附加的数据等都会保留下来。
參数
expr String 用于筛选元素的jQuery表达式 演示样例描写叙述:从DOM中把全部段落删除HTML 代码:
<p>Hello</p> how are <p>you?</p>jQuery 代码:$("p").detach();结果: how are 描写叙述:从DOM中把带有hello类的段落删除HTML 代码:
<p class="hello">Hello</p> how are <p>you?</p>jQuery 代码:$("p").detach(".hello");结果: how are <p>you?</p>
attr(name|properties|key,value|fn)
设置或返回被选元素的属性值。參数
name String 属性名称properties Map 作为属性的“名/值对”对象
key,value String, Object 属性名称。属性值
key,function(index, attr) String,Function
1:属性名称。
2:返回属性值的函数,第一个參数为当前元素的索引值。第二个參数为原先的属性值。
演示样例參数name
描写叙述:返回文档中全部图像的src属性值。
jQuery 代码:
$("img").attr("src"); 參数properties描写叙述:为全部图像设置src和alt属性。
jQuery 代码:$("img").attr({ src: "test.jpg", alt: "Test Image" });
參数key,value 描写叙述:为全部图像设置src属性。
jQuery 代码:$("img").attr("src","test.jpg");
參数key,回调函数 描写叙述:把src属性的值设置为title属性的值。
jQuery 代码:$("img").attr("title", function() { return this.src });
版权声明:本文博客原创文章。博客,未经同意,不得转载。
本文转自mfrbuaa博客园博客,原文链接:http://www.cnblogs.com/mfrbuaa/p/4645158.html,如需转载请自行联系原作者