JQuery基本属性介绍

上传人:jiups****uk12 文档编号:88918521 上传时间:2019-05-13 格式:DOC 页数:12 大小:64KB
返回 下载 相关 举报
JQuery基本属性介绍_第1页
第1页 / 共12页
JQuery基本属性介绍_第2页
第2页 / 共12页
JQuery基本属性介绍_第3页
第3页 / 共12页
JQuery基本属性介绍_第4页
第4页 / 共12页
JQuery基本属性介绍_第5页
第5页 / 共12页
点击查看更多>>
资源描述

《JQuery基本属性介绍》由会员分享,可在线阅读,更多相关《JQuery基本属性介绍(12页珍藏版)》请在金锄头文库上搜索。

1、1 attr(name|properties|key,value|fn)概述设置或返回被选元素的属性值。参数nameStringV1.0属性名称properties MapV1.0作为属性的“名/值对”对象key,value String,ObjectV1.0属性名称,属性值key,function(index, attr) String,FunctionV1.11:属性名称。2:返回属性值的函数,第一个参数为当前元素的索引值,第二个参数为原先的属性值。示例参数name 描述:返回文档中所有图像的src属性值。jQuery 代码:$(img).attr(src);参数properties 描述

2、:为所有图像设置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 );2 removeAttr(name)概述从每一个匹配的元素中删除一个属性1.6以下版本在IE6使用JQuery的removeAttr方法删

3、除disabled是无效的。解决的方法就是使用$(XX).prop(disabled,false);1.7版本在IE6下已支持删除disabled。参数nameStringV1.0要删除的属性名示例描述:将文档中图像的src属性删除HTML 代码:jQuery 代码:$(img).removeAttr(src);结果: 3 prop(name|properties|key,value|fn)概述获取在匹配的元素集中的第一个元素的属性值。随着一些内置属性的DOM元素或window对象,如果试图将删除该属性,浏览器可能会产生错误。jQuery第一次分配undefined值的属性,而忽略了浏览器生成

4、的任何错误参数name StringV1.6属性名称properties MapV1.6作为属性的“名/值对”对象key,value String,ObjectV1.6属性名称,属性值key,function(index, attr) String,FunctionV1.61:属性名称。2:返回属性值的函数,第一个参数为当前元素的索引值,第二个参数为原先的属性值。示例参数name 描述:选中复选框为true,没选中为falsejQuery 代码:$(inputtype=checkbox).prop(checked);参数properties 描述:禁用页面上的所有复选框。jQuery 代码:$

5、(inputtype=checkbox).prop( disabled: true);参数key,value 描述:禁用和选中所有页面上的复选框。jQuery 代码:$(inputtype=checkbox).prop(disabled, false);$(inputtype=checkbox).prop(checked, true);参数key,回调函数 描述:通过函数来设置所有页面上的复选框被选中。jQuery 代码:$(inputtype=checkbox).prop(checked, function( i, val ) return !val;);4 removeProp(name)

6、概述用来删除由.prop()方法设置的属性集随着一些内置属性的DOM元素或window对象,如果试图将删除该属性,浏览器可能会产生错误。jQuery第一次分配undefined值的属性,而忽略了浏览器生成的任何错误参数propertyNameStringV1.6要删除的属性名示例描述:设置一个段落数字属性,然后将其删除。HTML 代码: jQuery 代码:var $para = $(p);$para.prop(luggageCode, 1234);$para.append(The secret luggage code is: , String($para.prop(luggageCode)

7、, . );$para.removeProp(luggageCode);$para.append(Now the secret luggage code is: , String($para.prop(luggageCode), . );结果:The secret luggage code is: 1234. Now the secret luggage code is: undefined. 5 addClass(class|fn)概述为每个匹配的元素添加指定的类名。参数classStringV1.0一个或多个要添加到元素中的CSS类名,请用空格分开function(index, class

8、)FunctionV1.4此函数必须返回一个或多个空格分隔的class名。接受两个参数,index参数为对象在这个集合中的索引值,class参数为这个对象原先的class属性值。示例参数class 描述:为匹配的元素加上 selected 类jQuery 代码:$(p).addClass(selected);$(p).addClass(selected1 selected2);回调函数 描述:给li加上不同的classHTML 代码: Hello Hello HellojQuery 代码:$(ul li:last).addClass(function() return item- + $(th

9、is).index(););6 toggleClass(class|fn,sw)概述如果存在(不存在)就删除(添加)一个类。参数classStringV1.0CSS类名class,switchString,BooleanV1.31:要切换的CSS类名. 2:用于决定元素是否包含class的布尔值。switchBooleanV1.4用于决定元素是否包含class的布尔值。function(index, class,switch), switch Function,BooleanV1.41:用来返回在匹配的元素集合中的每个元素上用来切换的样式类名的一个函数。接收元素的索引位置和元素旧的样式类作为参

10、数。2: 一个用来判断样式类添加还是移除的 boolean 值。 示例参数class 描述:为匹配的元素切换 selected 类jQuery 代码:$(p).toggleClass(selected);参数class,switch 描述:每点击三下加上一次 highlight 类HTML 代码:jQuery 代码:jQuery 代码: var count = 0; $(p).click(function() $(this).toggleClass(highlight, count+ % 3 = 0); );回调函数 描述:根据父元素来设置class属性jQuery 代码:$(div.foo)

11、.toggleClass(function() if ($(this).parent().is(.bar) return happy; else return sad; );7 html(val|fn)概述取得第一个匹配元素的html内容。这个函数不能用于XML文档。但可以用于XHTML文档。在一个 HTML 文档中, 我们可以使用 .html() 方法来获取任意一个元素的内容。 如果选择器匹配多于一个的元素,那么只有第一个匹配元素的 HTML 内容会被获取。参数valStringV1.0用于设定HTML内容的值function(index, html)FunctionV1.4此函数返回一个H

12、TML字符串。接受两个参数,index为元素在集合中的索引位置,html为原先的HTML值。示例无参数 描述:返回p元素的内容。jQuery 代码:$(p).html();参数val 描述:设置所有 p 元素的内容jQuery 代码:$(p).html(Hello world!);回调函数描述:使用函数来设置所有匹配元素的内容。jQuery 代码:$(p).html(function(n) return 这个 p 元素的 index 是: + n; );8 text(val|fn)概述取得所有匹配元素的内容。结果是由所有匹配元素包含的文本内容组合起来的文本。这个方法对HTML和XML文档都有效

13、。参数valStringV1.0用于设置元素内容的文本function(index, text)FunctionV1.4此函数返回一个字符串。接受两个参数,index为元素在集合中的索引位置,text为原先的text值。示例无参数 描述:返回p元素的文本内容。jQuery 代码:$(p).text();参数val 描述:设置所有 p 元素的文本内容jQuery 代码:$(p).text(Hello world!);回调函数 描述:使用函数来设置所有匹配元素的文本内容。jQuery 代码:$(p).text(function(n) return 这个 p 元素的 index 是: + n; );9 返回值:String,Arrayval(val|fn|arr)概述获得匹配元素的当前值。在 jQuery 1.2 中,可以返回任意元素的值了。包括select。如果多选,将返回一个数组,其包含所选的值。参数valStringV1.0要设置的值。function(index, value)FunctionV1.4此函数返回一个要设置的值。接受两个参数,index为元素在集合中的索引位置,text为原先的text值。arrayArrayV1.0用于 check/select 的值示例无参数 描述:获取文本框中的值jQuery 代码:$(input).val();参数

展开阅读全文
相关资源
相关搜索

当前位置:首页 > 中学教育 > 其它中学文档

电脑版 |金锄头文库版权所有
经营许可证:蜀ICP备13022795号 | 川公网安备 51140202000112号