jQuery HTML/CSS 方法- 获得内容

text()方法设置或返回被选元素的文本内容。
当该方法用于返回内容时,则返回所有匹配元素的文本内容(会删除 HTML 标记)。
当该方法用于设置内容时,则重写所有匹配元素的内容。
提示:如需设置或返回被选元素的 innerHTML(文本 + HTML 标记),请使用 html() 方法。
语法:1.返回文本内容:$(selector).text()
2.设置文本内容:$(selector).text(content)
3.使用函数设置文本内容:$(selector).text(function(index,currentcontent))

html()方法设置或返回被选元素的内容(innerHTML)。
当该方法用于返回内容时,则返回第一个匹配元素的内容。
当该方法用于设置内容时,则重写所有匹配元素的内容。
提示:如只需设置或返回被选元素的文本内容,请使用 text() 方法。
语法:1.返回内容:$(selector).html()
2.设置内容:$(selector).html(content)
3.使用函数设置内容:$(selector).html(function(index,currentcontent))

val()方法返回或设置被选元素的 value 属性。
当用于返回值时:该方法返回第一个匹配元素的 value 属性的值。
当用于设置值时:该方法设置所有匹配元素的 value 属性的值。
注意:val() 方法通常与 HTML 表单元素一起使用。
语法:1.返回 value 属性:$(selector).val()
2.设置 value 属性:$(selector).val(value)
3.通过函数设置 value 属性:$(selector).val(function(index,currentvalue))

jQuery HTML/CSS 方法- 元素属性

attr()方法设置或返回被选元素的属性和值。
当该方法用于返回属性值,则返回第一个匹配元素的值。
当该方法用于设置属性值,则为匹配元素设置一个或多个属性/值对。
语法:1.返回属性的值:$(selector).attr(attribute)
2.设置属性和值:$(selector).attr(attribute,value)
3.使用函数设置属性和值:$(selector).attr(attribute,function(index,currentvalue))
4.设置多个属性和值:$(selector).attr({attribute:value, attribute:value,...})
参数:attribute:规定属性的名称。
value:规定属性的值。
function(index,currentvalue):规定要返回属性值到集合的函数。index - 接受集合中元素的 index 位置。currentvalue - 接受被选元素的当前属性值。

removeAttr()方法从被选元素移除一个或多个属性。
语法:$(selector).removeAttr(attribute)
参数:attribute:必需。规定要移除的一个或多个属性。如需移除若干个属性,请使用空格分隔属性名称。

prop()方法设置或返回被选元素的属性和值。
当该方法用于返回属性值时,则返回第一个匹配元素的值。
当该方法用于设置属性值时,则为匹配元素集合设置一个或多个属性/值对。
注意:prop() 方法应该用于检索属性值,例如 DOM 属性(如 tagName、nodeName、defaultChecked)或您自定义的属性。
提示:如需检索 HTML 属性,请使用 attr() 方法代替。
提示:如需移除属性,请使用 removeProp() 方法。
语法:1.返回属性的值:$(selector).prop(property)
2.设置属性和值:$(selector).prop(property,value)
3.使用函数设置属性和值:$(selector).prop(property,function(index,currentvalue))
4.设置多个属性和值:$(selector).prop({property:value, property:value,...})
参数:property:规定属性的名称。
value:规定属性的值。
function(index,currentvalue):规定要返回属性值到集合的函数。index - 接受集合中元素的 index 位置。currentvalue - 接受被选元素的当前属性值。

removeProp()方法移除由 prop() 方法设置的属性。
注意:不要使用该方法来移除诸如 style、id 或 checked 之类的 HTML 属性。请使用 removeAttr() 方法代替。
参数:property:规定要移除的属性的名称。

jQuery HTML/CSS 方法- 添加元素

append()方法在被选元素的结尾插入指定内容。
提示:如需在被选元素的开头插入内容,请使用 prepend() 方法。
语法:$(selector).append(content,function(index,html))
参数:content:必需。规定要插入的内容(可包含 HTML 标签)。可能的值:HTML 元素、jQuery 对象、DOM 元素
function(index,html):可选。规定返回待插入内容的函数。index - 返回集合中元素的 index 位置。html - 返回被选元素的当前 HTML。

prepend()方法在被选元素的开头插入指定内容。
提示:如需在被选元素的结尾插入内容,请使用 append() 方法。
语法:$(selector).prepend(content,function(index,html))
参数:content:必需。规定要插入的内容(可包含 HTML 标签)。可能的值:HTML 元素、jQuery 对象、DOM 元素
function(index,html):可选。规定返回待插入内容的函数。index - 返回集合中元素的 index 位置。html - 返回被选元素的当前 HTML。

appendTo()方法在被选元素的结尾插入 HTML 元素。
提示:如需在被选元素的开头插入 HTML 元素,请使用 prependTo() 方法。
语法:$(content).appendTo(selector)
参数:content:必需。规定要插入的内容(必须包含 HTML 标签)。注意:如果 content 是已存在的元素,它将从当前位置被移除,并在被选元素的结尾被插入。
selector:必需。规定把内容追加到哪个元素上。

prependTo()方法在被选元素的开头插入 HTML 元素。
提示:如需在被选元素的结尾插入 HTML 元素,请使用 appendTo() 方法。
语法:$(content).prependTo(selector)
参数:content:必需。规定要插入的内容(必须包含 HTML 标签)。注意:如果 content 是已存在的元素,它将从当前位置被移除,并在被选元素的开头被插入。
selector:必需。规定把内容预加到哪个元素上。

after() 方法在被选元素后插入指定的内容。
提示:如需在被选元素前插入内容,请使用 before() 方法。
语法:$(selector).after(content,function(index))
参数:content:必需。规定要插入的内容(可包含 HTML 标签)。可能的值:HTML 元素、jQuery 对象、DOM 元素
function(index):规定返回待插入内容的函数。index - 返回集合中元素的 index 位置。

before()方法在被选元素后插入指定的内容。
提示:如需在被选元素后插入内容,请使用 after() 方法。
语法:$(selector).before(content,function(index))
参数:content:规定要插入的内容(可包含 HTML 标签)。可能的值:HTML 元素、jQuery 对象、DOM 元素
function(index):可选。规定返回待插入内容的函数。index - 返回集合中元素的 index 位置。

insertAfter()方法在被选元素后插入 HTML 元素。
提示:如需在被选元素前插入 HTML 元素,请使用 insertBefore() 方法。
语法:$(content).insertAfter(selector)
参数 :content:必需。规定要插入的内容(必须包含 HTML 标签)。注意:如果 content 是已存在的元素,它将从它的当前位置被移除,并被插入在被选元素之后。
selector:必需。规定在何处插入内容。

insertBefore()方法在被选元素前插入 HTML 元素。
提示:如需在被选元素后插入 HTML 元素,请使用 insertAfter() 方法。
语法:$(content).insertBefore(selector)
参数:content:必需。规定要插入的内容(必须包含 HTML 标签)。注意:如果 content 是已存在的元素,它将从它的当前位置被移除,并被插入在被选元素之前。
selector:必需。规定在何处插入内容。

jQuery HTML/CSS 方法- 删除元素

remove()方法移除被选元素,包括所有的文本和子节点。
该方法也会移除被选元素的数据和事件。
提示:如需移除元素,但保留数据和事件,请使用 detach() 方法代替。
提示:如只需从被选元素移除内容,请使用 empty() 方法
语法:$(selector).remove()

empty()方法从被选元素所有子节点和内容。
注意:该方法不会移除元素本身,或它的属性。
提示:如需移除元素,但保留数据和事件,请使用 detach() 方法。
提示:如需移除元素及它的数据和事件,请使用 remove() 方法。
语法:$(selector).empty()

detach()方法移除被选元素,包括所有的文本和子节点。然后它会保留数据和事件。
该方法会保留移除元素的副本,允许它们在以后被重新插入。
提示:如需移除元素及它的数据和事件,请使用 remove() 方法代替。
提示:如只需从被选元素移除内容,请使用 empty() 方法。
语法:$(selector).detach()

unwrap()方法移除被选元素的父元素。
语法:$(selector).unwrap()

jQuery HTML/CSS 方法- 元素副本和替换

clone()方法生成被选元素的副本,包含子节点、文本和属性。
语法:$(selector).clone(true|false)
参数:true:规定需复制事件处理程序。
false:默认。规定不复制事件处理程序。

replaceAll()方法吧被选元素替换为新的 HTML 元素。
语法:$(content).replaceAll(selector)
参数:content:必需。规定要插入的内容(必须包含 HTML 标签)。
selector:必需。规定哪一个元素将被替换。

replaceWith()方法把被选元素替换为新的内容。
语法:$(selector).replaceWith(content,function(index))
参数:content:必需。规定要插入的内容(可包含 HTML 标签)。可能的值:HTML 元素、jQuery 对象、DOM 元素
function(index):可选。规定返回替换内容的函数。index - 返回集合中元素的 index 位置。

jQuery HTML/CSS 方法- 返回第一个定位的祖先元素

offsetParent()方法返回第一个定位的祖先元素。
提示:通过 jQuery 或 CSS 的 position 属性(relative、absolute 或 fixed)对元素进行定位。
语法:$(selector).offsetParent()

jQuery HTML/CSS 方法- 元素包裹

wrap()方法使用指定的 HTML 元素来包裹每个被选元素。
语法:$(selector).wrap(wrappingElement,function(index))
参数 :wrappingElement:必需。规定包裹每个被选元素的 HTML 元素。可能的值:HTML 元素、jQuery 对象、DOM 元素 function(index):可选。规定返回包裹元素的函数。index - 返回集合中元素的 index 位置。

wrapAll()方法使用指定的 HTML 元素来包裹所有被选元素。
语法:$(selector).wrapAll(wrappingElement)
参数:wrappingElement:必需。规定包裹被选元素的 HTML 元素。可能的值:HTML 元素、jQuery 对象、DOM 元素

wrapInner()方法使用指定的 HTML 元素来包裹每个被选元素中的所有内容(innerHTML)。
语法:$(selector).wrapInner(wrappingElement,function(index))
参数 :wrappingElement:必需。规定包围在每个被选元素的内容周围的 HTML 元素。 可能的值:HTML 元素、jQuery 对象、DOM 元素 function(index):可选。规定返回包裹元素的函数。index - 返回集合中元素的 index 位置。

jQuery HTML/CSS 方法- 元素尺寸

width()方法设置或返回被选元素的宽度。
当该方法用于返回宽度时, 则返回第一个匹配元素的宽度。
当该方法用于设置宽度时,则设置所有匹配元素的宽度。
该方法不包含 padding、border 或 margin。
相关方法: height() - 设置或返回元素的高度
innerWidth() - 返回元素的宽度(包含 padding)
innerHeight() - 返回元素的高度(包含 padding)
outerWidth() - 返回元素的宽度(包含 padding 和 border)
outerHeight() - 返回元素的高度(包含 padding 和 border)
outerWidth(true) - 返回元素的宽度(包含 padding 和 border 和 margin)
outerHeight(true) - 返回元素的高度(包含 padding 和 border 和 margin)
语法:1.返回宽度:$(selector).width()
2.设置宽度:$(selector).width(value) 3.使用函数设置宽度:$(selector).width(function(index,currentwidth))
参数 :value:当设置宽度时是必需的。规定元素的宽度,单位为 px、em、pt 等。默认单位是 px。 function(index,currentwidth):可选。规定返回被选元素新宽度的函数。index - 返回集合中元素的 index 位置。currentwidth - 返回被选元素的当前宽度。

height() 方法设置或返回被选元素的高度。
当该方法用于返回高度时, 则返回第一个匹配元素的高度。
当该方法用于设置高度时,则设置所有匹配元素的高度。
该方法不包含 padding、border 或 margin。
语法:1.返回高度:$(selector).height() 2.设置高度:$(selector).height(value) 3.使用函数设置高度:$(selector).height(function(index,currentheight))
参数 :value:当设置高度时是必需的。规定元素的高度,单位为 px、em、pt 等。默认单位是 px。
function(index,currentheight):可选。规定返回被选元素新高度的函数。index - 返回集合中元素的 index 位置。currentheight - 返回被选元素的当前高度。

innerWidth()方法返回第一个匹配元素的内部宽度。
该方法包含 padding,但不包含 border 和 margin。
语法:$(selector).innerWidth()

innerHeight()方法返回第一个匹配元素的内部高度。
该方法包含 padding,但不包含 border 和 margin。
语法:$(selector).innerHeight()

outerWidth()方法返回第一个匹配元素的外部宽度。
该方法包含 padding 和 border。
提示:如需包含 margin,请使用 outerHeight(true)。
语法:$(selector).outerWidth(includeMargin)
参数:includeMargin:可选。布尔值,规定是否包含 margin。false - 默认。不包含 margin。true - 包含 margin。

outerHeight()方法返回第一个匹配元素的外部高度。
该方法包含 padding 和 border。
提示:如需包含 margin,请使用 outerHeight(true)。
语法:$(selector).outerHeight(includeMargin)
参数:includeMargin 可选。布尔值,规定是否包含 margin。false - 默认。不包含 margin。true - 包含 margin。

offset()方法设置或返回被选元素相对于文档的偏移坐标。
当用于返回偏移时:该方法返回第一个匹配元素的偏移坐标。它返回一个带有两个属性(以像素为单位的 top 和 left 位置)的对象。
当用于设置偏移时:该方法设置所有匹配元素的偏移坐标。
语法:1.返回偏移坐标:$(selector).offset() 2.设置偏移坐标:$(selector).offset({top:value,left:value}) 3.使用函数设置偏移坐标:$(selector).offset(function(index,currentoffset))
参数 :{top:value,left:value}:当设置偏移时是必需的。规定以像素为单位的 top 和 left 坐标。 可能的值:名/值对,比如 {top:100,left:100}。一个带有 top 和 left 的对象(实例)
function(index,currentoffset):可选。规定返回包含 top 和 left 坐标的对象的函数。index - 返回集合中元素的 index 位置。currentoffset - 返回被选元素的当前坐标。

position()方法返回第一个匹配元素的位置(相对于它的父元素)。
该方法返回一个带有两个属性(以像素为单位的 top 和 left 位置)的对象。
语法:$(selector).position()

scrollLeft()方法设置或返回被选元素的水平滚动条位置。
提示:当滚动条位于最左侧时,位置是 0。
当用于返回位置时:该方法返回第一个匹配元素的滚动条的水平位置。
当用于设置位置时:该方法设置所有匹配元素的滚动条的水平位置。
语法:1.返回水平滚动条位置:$(selector).scrollLeft()
2.设置水平滚动条位置:$(selector).scrollLeft(position)
参数 :position:规定以像素为单位的水平滚动条位置。

scrollTop()方法设置或返回被选元素的垂直滚动条位置。
提示:当滚动条位于最顶部时,位置是 0。
当用于返回位置时:该方法返回第一个匹配元素的滚动条的垂直位置。
当用于设置位置时:该方法设置所有匹配元素的滚动条的垂直位置。
语法:1.返回垂直滚动条位置:$(selector).scrollTop()
2.设置垂直滚动条位置:$(selector).scrollTop(position)
参数:position:规定以像素为单位的垂直滚动条位置。

jQuery HTML/CSS 方法- CSS

addClass()方法向被选元素添加一个或多个类名。
该方法不会移除已存在的 class 属性,仅仅添加一个或多个类名到 class 属性。
提示:如需添加多个类,请使用空格分隔类名。
语法:$(selector).addClass(classname,function(index,oldclass))
参数 :classname:必需。规定一个或多个要添加的类名称。
function(index,currentclass):可选。规定返回一个或多个待添加类名的函数。index - 返回集合中元素的 index 位置。currentclass - 返回被选元素的当前类名。

removeClass()方法从被选元素移除一个或多个类。
注意:如果没有规定参数,则该方法将从被选元素中删除所有类。
语法:$(selector).removeClass(classname,function(index,currentclass))
参数 :classname:可选。规定要移除的一个或多个类名称。如需移除若干个类,请使用空格分隔类名称。注意: 如果该参数为空,则将移除所有类名称。
function(index,currentclass):可选。返回要移除的一个或多个类名称的函数。index - 返回集合中元素的 index 位置。currentclass - 返回被选元素的当前类名。

toggleClass()方法对添加和移除被选元素的一个或多个类进行切换。
该方法检查每个元素中指定的类。如果不存在则添加类,如果已设置则删除之。这就是所谓的切换效果。
然而,通过使用 "switch" 参数,您能够规定只删除或只添加类。
语法:$(selector).toggleClass(classname,function(index,currentclass),switch)
参数:classname:必需。规定添加或移除的一个或多个类名。如需规定若干个类,请使用空格分隔类名。
function(index,currentclass):可选。规定返回需要添加/删除的一个或多个类名的函数。index - 返回集合中元素的 index 位置。currentclass - 返回被选元素的当前类名。
switch:可选。布尔值,规定是否仅仅添加(true)或移除(false)类。

css()方法为被选元素设置或返回一个或多个样式属性。
当用于返回属性:该方法返回第一个匹配元素的指定 CSS 属性值。
然而,简写的 CSS 属性(比如 "background" 和 "border")不被完全支持,且当用于返回属性值时,在不同的浏览器中有不同的结果。
当用于设置属性:该方法为所有匹配元素设置指定 CSS 属性。
语法:1.返回 CSS 属性值:$(selector).css(property)
2.设置 CSS 属性和值:$(selector).css(property,value)
3.使用函数设置 CSS 属性和值:$(selector).css(property,function(index,currentvalue))
4.设置多个属性和值:$(selector).css({属性:value, 属性:value, ...})
参数 :property:规定 CSS 属性名称,比如 "color"、"font-weight" 等等。
value:规定 CSS 属性的值,比如 "red"、"bold" 等等。
function(index,currentvalue):规定返回 CSS 属性新值的函数。index - 返回集合中元素的 index 位置。currentvalue - 返回 CSS 属性的当前值。

hasClass()方法检查被选元素是否包含指定的类名称。
如果被选元素包含指定的类,该方法返回 "true"。
语法:$(selector).hasClass(classname)
参数:classname:必需。规定需要在被选元素中查找的类。