最新消息:

jQuery data(key, value)函数 在匹配的元素上随心所欲的存放数据 (2

Jquey admin 942浏览 0评论

data(key, value) 返回值:jQuery

 

在匹配的元素上随心所欲的存放数据。

  • 1.2.3 新增data(key, value)

    key (String) 将要设置的数据片段名。
    value (Object) 新的数据值;可以是任何 Javascript 数据类型,包括数组和对象。
  • 1.4.3 新增data(obj)

    obj (Object) 用于设置的键值对。

.data() 方法允许我们安全地将任何类型的数据附加到DOM元素上而不用担心循环引用和内存泄露之类的问题。

在单个元素上设置几个独立的数据,并且以后还可以分别检索到:

从 jQuery 1.4.3 起,通过 .data(obj) 给元素设置数据时,会在元素原先存放的数据上扩展。jQuery 本身也通过 .data() 方法存放信息,名为 ‘events’ 和 ‘handle’ ,并且保留的任何以下划线开头的数据名称,以供内部使用。

特别注意:从 jQuery 1.4 起到 jQuery 1.4.2 的几个版本中, .data(obj) 方法会完全替换掉元素上的所有数据,而不是扩展数据对象。如果你使用了第三方插件,那就不建议完全替换掉元素上的数据对象,因为插件也有可能在上面存放数据。

由于浏览器与插件和内部代码的交互方式,导致 .data() 方法无法在 <object> (除非他是一个Flash插件), <applet> 或者 <embed> 元素上存放数据。

HTML 5 data- 属性

从 jQuery 1.4.3 起,HTML 5 data- 属性 中的数据会自动放入 jQuery 的数据对象中。

举例来说,如果提供如下的 HTML:

那么就可以通过下面的 jQuery 代码获得数据。下面的每个语句都是 true。

注意,这些字符串在用 .data() 获取时会自动转换成他们对应数据类型(包括布尔值、数字、对象、数组和 null ),而 HTML 代码中的字符串不会有任何的改变。另外,data- 属性只会在第一次用 .data() 方法获取数据的时候,从 HTML 代码中获取,并保存到 jQuery 内部对象中。在此之后,.data() 再也不会访问或修改 data- 属性里的东西了。

示例:

往div元素上存放再获取数据

返回值:Objectdata(key)

返回jQuery对象集合中第一个元素上储存的数据,这个数据是先前用data(name, value)设定的。

  • 1.2.3 新增data(key)

    key (String) 先前存放的数据名
  • 1.4 新增data()

.data() 方法允许我们安全地将任何类型的数据附加到DOM元素上而不用担心循环引用和内存泄露之类的问题。我们可以同时获取单一元素上几个独立的数据,或者整个一组:

上面两行会显示先前设置在 body 元素上的数据。如果元素上没有设置过任何东西,则会返回 null 。

调用 .data() 时如果不带参数,将会以 JavaScript 对象的形式获取所有数据。这个对象可以安全的存放在变量中,因为一旦这个新对象被提取出来,之后对元素进行的 .data(obj) 操作,将无法再影响到这个对象了。另外,直接操作对象会比通过调用 .data()来设置或获取值要快一些:

示例:

获取存放在元素上,名为 “blah” 的数据。

转载请注明:中国翼通 » jQuery data(key, value)函数 在匹配的元素上随心所欲的存放数据 (2


分享到:
已有 0 条评论 新浪微博