jquery 学习之二 属性相关

attr(name)
取得第一个匹配元素的属性值。通过这个方法可以方便地从第一个匹配元素中获取一个属性的值。如果元素没有相应属性，则返回 undefined 。
Access a property on the first matched element. This method makes it easy to retrieve a property value from the first matched element. If the element does not have an attribute with such a name, undefined is returned.
返回值
Object

参数
name (String) : 属性名称

示例
返回文档中第一个图像的src属性值。

HTML 代码:

<img src="test.jpg"/>
jQuery 代码:

$("img").attr("src");
结果:

test.jpg
---------------------------------------------------------------------------------------------------------------------------------------
attr(properties)
将一个“名/值”形式的对象设置为所有匹配元素的属性。
这是一种在所有匹配元素中批量设置很多属性的最佳方式。 注意，如果你要设置对象的class属性，你必须使用'className' 作为属性名。或者你可以直接使用.addClass( class ) 和 .removeClass( class ).
Set a key/value object as properties to all matched elements.
This serves as the best way to set a large number of properties on all matched elements. Note that you must use 'className' as key if you want to set the class-Attribute. Or use .addClass( class ) or .removeClass( class ).
返回值
jQuery

参数
properties (Map) : 作为属性的“名/值对”对象

示例
为所有图像设置src和alt属性。

HTML 代码:

<img/>
jQuery 代码:

$("img").attr({ src: "test.jpg", alt: "Test Image" });
结果:

[ <img src= "test.jpg" alt:="Test Image" /> ]
---------------------------------------------------------------------------------------------------------------------------------------
attr(key,value)
为所有匹配的元素设置一个属性值。
Set a single property to a value, on all matched elements.
返回值
jQuery

参数
key (String) : 属性名称

value (Object) : 属性值

示例
为所有图像设置src属性。

HTML 代码:

<img/>
<img/>
jQuery 代码:

$("img").attr("src","test.jpg");
结果:

[ <img src= "test.jpg" /> , <img src= "test.jpg" /> ]
---------------------------------------------------------------------------------------------------------------------------------------
attr(key,fn)
为所有匹配的元素设置一个计算的属性值。
不提供值，而是提供一个函数，由这个函数计算的值作为属性值。
Set a single property to a computed value, on all matched elements.
Instead of supplying a string value as described 'above', a function is provided that computes the value.
返回值
jQuery

参数
key (String) : 属性名称

fn (Function) : 返回值的函数 范围:当前元素, 参数: 当前元素的索引值

示例
把src属性的值设置为title属性的值。

HTML 代码:

<img src="test.jpg"/>
jQuery 代码:

$("img").attr("title", function() { return this.src });
结果:

<img src="test.jpg" title="test.jpg" />
---------------------------------------------------------------------------------------------------------------------------------------
removeAttr(name)
从每一个匹配的元素中删除一个属性
Remove an attribute from each of the matched elements.
返回值
jQuery

参数
name (String) : 要删除的属性名

示例
将文档中图像的src属性删除

HTML 代码:

<img src="test.jpg"/>
jQuery 代码:

$("img").removeAttr("src");
结果:

[ <img /> ]

赞 (0)

相关推荐

  • juqery 学习之三 选择器 子元素与表单

    :nth-child(index/even/odd/equation) 匹配其父元素下的第N个子或奇偶元素 ':eq(index)' 只匹配一个元素,而这个将为每一个父元素匹配子元素.:nth-child从1开始的,而:eq()是从0算起的! 可以使用:nth-child(even):nth-child(odd):nth-child(3n):nth-child(2):nth-child(3n+1):nth-child(3n+2) Matches the nth-child of its pare

  • 初窥JQuery(二) 事件机制(1)

    当然它的优点并不只在于这点,使用JQuery事件处理机制比直接使用Javascript本身内置的一些事件相应方式更加的灵活,更加不容易暴露在外,而且有更加优雅的语法,大大减少了我们工作的量度. JQuery的事件处理机制包括:页面加载.事件绑定.事件委派.事件切换四种机制.我们先从$(document).ready()事件开始. 一.页面加载$(document).ready()相当与Javascript中的onLoad()事件,都是在页面加载的时候执行该方法,但是两者又有着微妙的差别,read

  • 初窥JQuery(一)jquery选择符 必备知识点

    本章内容根据本人在开发中常用到的选择符作为例子来进行讲解,如有更多常用的简单的例子可回复提供,参与讨论,一起学习研究,首先我们从常用的CSS选择符开始. CSS选择符包括通配选择符.ID选择符.属性选择符.包含选择符.类选择符等,他们的基本格式为: 通配选择符:$("#ID *") 表示该元素下的所有元素. ID选择符:$("#ID") 表示获得指定ID的元素. 属性选择符:$("input[type=text]") 表示type属性为text的

  • jquery 学习之二 属性(类)

    addClass(class) 为每个匹配的元素添加指定的类名. Adds the specified class(es) to each of the set of matched elements. 返回值 jQuery 参数 class (String) : 一个或多个要添加到元素中的CSS类名,请用空格分开 示例 为匹配的元素加上 'selected' 类 HTML 代码: <p>Hello</p> jQuery 代码: $("p").addClass(

  • jquery 学习之二 属性 文本与值(text,val)

    text() 取得所有匹配元素的内容. 结果是由所有匹配元素包含的文本内容组合起来的文本.这个方法对HTML和XML文档都有效. Get the text contents of all matched elements. The result is a string that contains the combined text contents of all matched elements. This method works on both HTML and XML documents.

  • jquery 学习之一 对象访问

    each() each(callback) 以每一个匹配的元素作为上下文来执行一个函数. 意味着,每次执行传递进来的函数时,函数中的this关键字都指向一个不同的DOM元素(每次都是一个不同的匹配元素). 而且,在每次执行函数时,都会给函数传递一个表示作为执行环境的元素在匹配的元素集合中所处位置的数字值作为参数(从零开始的整形). 返回 'false' 将停止循环 (就像在普通的循环中使用 'break').返回 'true' 跳至下一个循环(就像在普通的循环中使用'continue'). Ex

  • jquery 学习之二 属性(html()与html(val))

    html() 取得第一个匹配元素的html内容.这个函数不能用于XML文档.但可以用于XHTML文档. Get the html contents of the first matched element. This property is not available on XML documents (although it will work for XHTML documents). 返回值 String 示例 复制代码 代码如下: HTML 代码: <div><p>Hell

  • jquery 学习之二 属性相关

    attr(name) 取得第一个匹配元素的属性值.通过这个方法可以方便地从第一个匹配元素中获取一个属性的值.如果元素没有相应属性,则返回 undefined . Access a property on the first matched element. This method makes it easy to retrieve a property value from the first matched element. If the element does not have an at

  • JQuery 学习笔记 element属性控制

    复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv=&qu

  • jquery学习笔记二 实现可编辑的表格

    jquery学习笔记二 实现可编辑的表格

    实现可编辑的表格demo: 实例图: 代码: 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runa

  • JQuery学习总结【二】

    JQuery学习总结【二】

    一:JQuery知识点 *:JQuery的dom操作 *:动态创建dom节点 比如动态创建表格等,在js里面进行完成. *删除节点 这里面的删除就是将其放在了一个地方,并不是真的删除,之后可以使用. *:document方法 1:.val()可以获取到文本框里面的值,若括号里面有值则直接为赋值. Eg:加法计算器 <!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml"

  • JavaScript事件学习小结(二)js事件处理程序

    JavaScript事件学习小结(二)js事件处理程序

    相关阅读: JavaScript事件学习小结(五)js中事件类型之鼠标事件 http://www.jb51.net/article/86259.htm JavaScript事件学习小结(一)事件流 http://www.jb51.net/article/86261.htm javaScript事件学习小结(四)event的公共成员(属性和方法) http://www.jb51.net/article/86262.htm JavaScript事件学习小结(二)js事件处理程序 http://www

  • MyBatis学习教程(二)—如何使用MyBatis对users表执行CRUD操作

    上一篇文章MyBatis入门学习教程(一)-MyBatis快速入门中我们讲了如何使用Mybatis查询users表中的数据,算是对MyBatis有一个初步的入门了,今天讲解一下如何使用MyBatis对users表执行CRUD操作.在没奔主题之前,先给大家补充点有关mybatis和crud的基本知识. 什么是 MyBatis? MyBatis 是支持普通 SQL 查询,存储过程和高级映射的优秀持久层框架. MyBatis 消除了几乎所有的 JDBC 代码和参数的手工设置以及对结果集的检索.MyBa

  • jQuery学习笔记之Ajax用法实例详解

    本文实例讲述了jQuery学习笔记之Ajax用法.分享给大家供大家参考,具体如下: 一.Ajax请求 1.jQuery.ajax(options) 通过 HTTP 请求加载远程数据.jQuery 底层 AJAX 实现.简单易用的高层实现见 .get,.post 等. .ajax()返回其创建的XMLHttpRequest对象.大多数情况下你无需直接操作该对象,但特殊情况下可用于手动终止请求..ajax() 只有一个参数:参数 key/value 对象,包含各配置及回调函数信息.详细参数选项见下.

随机推荐