<div>
<div>Hello</div>
<div>Goodbye</div>
</div>$( ".inner" ).wrapAll( "<div />");<div>
<div>
<div>Hello</div>
<div>Goodbye</div>
</div>
</div>
.wrapInner(wrappingElement) / .wrapInner(function(index)) 包裹匹配元素内容,这个不好说,一看例子就懂
Wrap an HTML structure around the content of each element in the set of matched elements.
复制代码 代码如下:
<div>
<div>Hello</div>
<div>Goodbye</div>
</div>$( ".inner" ).wrapInner( "<div></div>");
<div>
<div>
<div>Hello</div>
</div>
<div>
<div>Goodbye</div>
</div>
</div>
.unwap() 把DOM元素的parent移除
Remove the parents of the set of matched elements from the DOM, leaving the matched elements in their place.
复制代码 代码如下:
pTags = $( "p" ).unwrap();
属性方法
.val() 获取元素的value值
Get the current value of the first element in the set of matched elements.
复制代码 代码如下:
$( "input:checkbox:checked" ).val();
.val(value) /.val(function(index,value)) 为元素设置值,index和value同样是指在为集合中每个元素设置的时候该元素的index和原value值
Set the value of each element in the set of matched elements.
复制代码 代码如下:
$( "input" ).val( ‘hello' );
$( "input" ).on( "blur", function() {
$( this ).val(function( i, val ) {
return val.toUpperCase();
});
});
.attr(attributeName) 获取元素特定属性的值
Get the value of an attribute for the first element in the set of matched elements.
复制代码 代码如下:
var title = $( "em" ).attr( "title" );
.attr(attributeName,value) / .attr(attributesJson) / .attr( attributeName, function(index, attr) ) 为元素属性赋值
Set one or more attributes for the set of matched elements.
复制代码 代码如下:
$( "#greatphoto" ).attr( "alt", "Beijing Brush Seller" );
$( "#greatphoto" ).attr({
alt: "Beijing Brush Seller",
title: "photo by Kelly Clark"
});
$( "#greatphoto" ).attr( "title", function( i, val ) {
return val + " - photo by Kelly Clark";
});
.prop( propertyName ) 获取元素某特性值
Get the value of a property for the first element in the set of matched elements.
复制代码 代码如下:
$( elem ).prop( "checked" )
.prop(propertyName,value) / .prop(propertiesJson) / .prop(propertyName,function(index,oldPropertyValue)) 为元素特性赋值
Set one or more properties for the set of matched elements.
复制代码 代码如下:
$( "input" ).prop( "checked", true );
$( "input[type='checkbox']" ).prop( "checked", function( i, val ) {
return !val;
});
$( "input[type='checkbox']" ).prop({
disabled: true
});
关于attribute 和 property区别可以看看 jQuery的attr与prop
.data(key,value) / .value(json) 为HTML DOM元素添加数据,HTML5元素 已有data-*属性
Store arbitrary data associated with the matched elements.The .data() method allows us to attach data of any type to DOM elements in a way that is safe from circular references and therefore from memory leaks.
复制代码 代码如下:
$( "body" ).data( "foo", 52 );
$( "body" ).data( "bar", { myType: "test", count: 40 } );
$( "body" ).data( { baz: [ 1, 2, 3 ] } );
.data(key) / .data() 获取获取data设置的数据或者HTML5 data-*属性中的数据
Return the value at the named data store for the first element in the jQuery collection, as set by data(name, value) or by an HTML5 data-* attribute.
复制代码 代码如下:
alert( $( "body" ).data( "foo" ) );
alert( $( "body" ).data() );
alert( $( "body" ).data( "foo" ) ); // undefined
$( "body" ).data( "bar", "foobar" );
alert( $( "body" ).data( "bar" ) ); // foobar
CSS方法
.hasClass(calssName) 检查元素是否包含某个class,返回true/false
Determine whether any of the matched elements are assigned the given class.
复制代码 代码如下:
$( "#mydiv" ).hasClass( "foo" )
.addClass(className) / .addClass(function(index,currentClass)) 为元素添加class,不是覆盖原class,是追加,也不会检查重复
Adds the specified class(es) to each of the set of matched elements.
复制代码 代码如下:
$( "p" ).addClass( "myClass yourClass" );
$( "ul li" ).addClass(function( index ) {
return "item-" + index;
});
removeClass([className]) / ,removeClass(function(index,class)) 移除元素单个/多个/所有class
Remove a single class, multiple classes, or all classes from each element in the set of matched elements.
复制代码 代码如下:
$( "p" ).removeClass( "myClass yourClass" );
$( "li:last" ).removeClass(function() {
return $( this ).prev().attr( "class" );
});