jQuery 属性操作

1.利用jQuery进行元素属性的操作

2.利用jQuery进行元素的操作

传统的DOM操作：

设置元素：元素对象.setAttribute(属性名称，属性内容);

取得属性：元素对象.getAttribute(属性名称)。

删除属性: 元素对象.removeAttribute(属性名称)

实际上在之前已经使用过了一个attr()的函数，这个函数的主要目的就是设置属性操作；

范例：设置属性

//找到在div中直接img子元素设置src属性

$("div>img").attr("src","images/koala.jpg");

$("div>img").attr("width","200px");

如果现在要设置一个元素的属性，并且假设属性很多的话，那么需要调用多次attr()函数，

在DOM操作里面可以利用JSON结构进行一组属性的设置；

$("div>img").attr({"src":"images/koala.jpg","width":"300"});

在以后的开发过程之中，一定要使用JSON设置程序结构，通过以上的attr()函数，

实际上就应该在jQuery里面设置的内容可以是字符串也可以是JSON结构；

属性的删除操作:

范例：删除属性

$("div>img").removeAttr("width");

在之前曾经学习过一个text()和html()函数，这两个函数当时主要的功能是进行内容的设置，但是对于这两个函数也可以进行内容的取得。

范例：取得内容

<div><span><h1>hello</h1></span></div>

alert($("div>span").html());//取得的内容包含有h1元素

alert($("div>span").text());//取得的内容不包含有h1元素

如果说取出属性内容，例如：假设文本输入组件中存在有value属性，如果要取出内容，使用

val()函数即可，这个函数既可以取出，也可以设置；

范例：取得组件内容

<input id="msg" type="text" value="hello">

alert($(msg).val());

$(msg).val("I'm jianzhu");

val()函数的主要功能就是进行value属性的设置，这一点是在开发之中较为常见的作法；

在之前是使用了attr()函数操作了“class”属性，那么这个属性用于设置一个整体的样式，

而在jQuery里面提供有一个addClass()函数，这个函数的主要功能也可以进行样式属性的设置，

它可以叠加多个样式。

范例：叠加样式

<input id="msg" type="text" value="I'm jianzhu">

$(msg).addClass("infocls");

很多时候可能操作的只是一种样式的设置，而不是一组样式的设置；

基本上属性的操作都是围绕样式为主。

既然可以设置属性样式，那么也可以删除一组样式

范例：删除一组样式

$("div>span").removeClass("infocls");

那么除了这些样式能够轻松取得之外，那么属性也可以利用attr()函数取得。

范例：取得属性

alert($("div>span").attr("class"));

只要是元素中定义的属性，attr()都可以取出，不关心是否是标准的属性名称。