替换HTML或文本内容
语法:html()
功能:获取匹配集里第一个元素的HTML内容。
返回:第一个已匹配元素的HTML内容。
语法:html(text)
功能:把传入的HTML片段设置为所有匹配元素的内容。
参数 text:(字符串)将被设置为元素内容的HTML片段。
返回:包装集。
语法:text()
功能:把包装集里元素的所有文本内容连接起来,并返回字符串作为命令的结果。
返回:连接而民的字符串。
语法:text(content)
功能:把所有已包装元素的文本内容设置为已传递值。如果已传递文本包含“<”或“>”,则这些字符被替换为等价的HTML实体。
参数 content:(字符串)将要设置到已包装元素里的文本内容。
返回:包装集。
注意:用这些命令来设置元素的内部HTML或文本,将替换元素里的原先内容。
移动和复制元素
语法:append(content)
功能:把传入的HTML片段或元素追加到所有已匹配内容之后。
参数 content:(字符串、元素、对象)将被追加到包装集各元素的一个字符串、元素或包装集对象。
返回:包装集。
例1:从传入的字符串创建HTML片段,追加到所有<p>元素的现有内容的末尾。
$('p').append('<b>some text</b>');
例2:标识DOM现有元素作为追加项。
$('p#appendToMe').append($('a.appendMe'));
注意:对原始元素的布置取决于作为追加目标的元素的数量。如果是单一的目标,则元素从原始位置删除(即,执行把原始元素移动到新父元素的操作)。如果有多个目标,则原始元素留在原处,而原始元素的副本被追加到各个目标元素(即,复制操作)。
如果不想追加整个包装集,也可以引用一个特定DOM元素,例如:
var toAppend = $('a.appendMe')[0];
$('p#appendToMe').append(toAppend);
语法:appendTo(target)
功能:把包装集里所有元素移动到指定目标的内容的末尾。
参数 target:(字符串、元素)一个包含jQuery选择器的字符串,或一个DOM元素。包装集各元素将追加到target所指定的那个位置。如果多个元素与一个选择器字符串匹配,则包装集各元素将被复制到与选择器匹配的每个元素。
返回:包装集。
工作方式类似的相关命令
- prepend(content) 和 prependTo(target):在目标元素的内容之前插入源元素。
- before(content) 和 insertBefore(target):在目标元素之前插入元素,而不是在目标元素的第一个子元素之前。
- after(content) 和 insertAfter(target):在目标元素之后插入元素,而不是在目标元素的最后一个子元素之后。
包裹元素
语法:wrap(wrapper)
功能:把匹配集各元素用已传递HTML标签或已传递元素的克隆副本分别包裹起来。
参数 wrapper:(字符串、元素)用于包裹匹配集各元素的元素开始和结束标签;或者一个将被克隆且用作包裹器的元素。
返回:包装集。
例如:把带有surprise类链接包裹在div元素中。
$('a.surprise').wrap('<div></div>');
注意:若多个元素被收集于匹配集,则该方法分别操作其中的每个元素。
语法:wrapAll(wrapper)
功能:用已传递元素的克隆副本或已传递HTML标签,把匹配集的元素作为一个单元包裹起来。
参数 wrapper:(字符串、元素)用于包裹匹配集所有元素的元素开始和结束标签,或一个将被克隆且用作包裹器的元素。
返回:包装集。
语法:wrapInner(wrapper)
功能:用已传递元素的克隆副本或已传递HTML标签,把匹配集各元素的内容(包括文本节点)分别包裹起来。
参数 wrapper:(字符串、元素)用于包裹匹配集各元素的元素开始和结束标签;或者一个将被克隆且用作包裹器的元素。
返回:包裹集。
删除元素
语法:remove()
功能:从页面DOM里删除包装集里所有元素。
返回:包装集。
注意:从DOM里删除的元素仍然被该包装集引用着(因此不符合垃圾回收条件),并可用其他jQuery命令来进一步操作,包括appendTo()、prependTo()、insertBefore()、insertAfter()等。
语法:empty()
功能:清空匹配集里所有DOM元素的内容。
返回:包装集。
利用remove()和after()命令来实现替换操作,如下:
$.fn.replaceWith = function(html) {
return this.after(html).remove();
}
$('div.elementToReplace').replaceWith('<p>替换成我。</p>');
克隆元素
语法:clone(copyHandlers)
功能:创建包装集里元素的副本,并返回包含这些副本的新包装集。元素以及任何后代元素都被复制。事件处理程序是否被复制,取决于参数copyHandlers的设置。
参数 copyHandlers:(boolean)若为true,复制事件处理程序;若为false或省略,则不复制。
返回:新创建的包装集。
分享到:
相关推荐
用jquery获取元素内容需要分两个情况: input 用val(); var value = $(‘#test’).val(); 是否为空的判断方法: if(value.length == 0){} 如果value为空执行的操作 if(value!=”){} 如果value不为空执行的操作 ...
用JQuery写的拖动元素进行排序的方法,包含拖动排序、拖动移除、拖动添加。 代码完整可用。没有用到第三方插件,自主可控。 原理是用CSS中position定位来跟踪鼠标移动,就是让元素跟踪鼠标位置,然后判断其在页面...
jQuery,滚动,jQuery 子级元素在父级元素内滚动
实用的jquery添加删除元素,代码很简单,在这里记录下
利用jquery ui和append实现元素添加,拖动。自定义div大小!
常用的JQuery元素查找,很详细全面。
jquery表单元素取值 很实用 强大
之前购买的收费插件,拖动排序元素,应该还可以,分享一下。
jquery实现元素置顶,可以实现任意的元素置顶或者距离顶部多少像素
jQuery设置元素 jQuery复制元素 1、jQuery获得元素 jQuery 中非常重要的部分,就是操作 DOM 的能力。 jQuery 提供一系列与 DOM 相关的方法,这使访问和操作元素和属性变得很容易。 回忆:DOM = Document Object ...
下面小编就为大家带来一篇jquery设置表单元素为不可用的简单代码。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
jQuery表单元素美化插件,jQuery表单元素美化插件,jQuery表单元素美化插件,jQuery表单元素美化插件,jQuery表单元素美化插件
jquery元素跟随鼠标移动
Web JQuery框架操作元素的属性与样式
jQuery获取当前点击的对象元素(实现代码) [removed][removed] </head> <body> 段落1 段落2 段落3 段落4 段落5 [removed] //获取当前点击的对象 $('p').click( function(){ //this表示当前被...
话不多说,下面就跟着小编来看下利用jquery实现删除数组中重复元素的具体思路吧 首先定义如下数组: var arr=[0,2,3,5,6,9,2]; 我们可以看到数组中存在重复元素’2′; 最后通过jquery筛选应该得到[0,2,3,5,6,9]; ok...
主要介绍了jQuery使用之设置元素样式用法,实例分析了jQuery如何设置页面的样式风格,包括添加、删除、动态切换等的使用技巧,需要的朋友可以参考下
jQuery多元素组合动画滑动幻灯片
jQuery选择器:jQuery的Document元素选择 1。 从$开始 2。xpath+css 3。常用自定义选择器
在jquery中offset().top是相对于body来说的,另外在设置top值的时候要找到与该元素最近的有相对值的元素