data()在元素上存放或者读取数据,返回jquery对象。

demo:

<div data-obj="{'name':'zhangsan','age':20}"></div>

$('div').data('obj').age     //20

在元素上data对象,key值一定要加引号。

$('div').data('arr',[3,4,5,6]);//赋值

$('div').data('obj1',{name:'lisi',age:30});//赋值

在元素上移除存放的数据removeData()

$('div').removeData('obj')// 在元素上移除存放的数据

jQuery.data(el,key,value)

el:要关联数据的DON对象

key: 存储的数据名

value: 将要存储的任意数据

jQuery.data(document.body,'bar','test')

id选择器,可以使用特殊字符,但是必须用反斜杠:\\进行转义

<div id="foo:bar"></div> <div id="foo[bar]"></div>  <div id="foo.bar"></div>

$("#foo\\:bar") $("#foo\\[bar\\]")    $("#foo\\.bar")

:header 匹配h1,h2,h3之类的标题元素

$(":input") 匹配所有的input textarea select button元素

$(":text") 匹配所有的单行文本框

$(":submit") 匹配所有的提交按钮,理论上只匹配type=“submit“的input 或者button,但是现在很多浏览器,button元素默认的type即为submit,所以很多情况下,不设置type的button也会成为筛选结果。

serialize()    序列化表格内容为字符串

demo

<form>
<select name="single">
<option>Single</option>
<option>Single2</option>
</select>
<select name="multiple" multiple="multiple">
<option selected="selected">Multiple</option>
<option>Multiple2</option>
<option selected="selected">Multiple3</option>
</select><br/>
<input type="checkbox" name="check" value="check1"/> check1
<input type="checkbox" name="check" value="check2" checked="checked"/> check2
<input type="radio" name="radio" value="radio1" checked="checked"/> radio1
<input type="radio" name="radio" value="radio2"/> radio2
</form>

序列化表格内容为字符串

$('form').serialize();     //     single=Single&multiple=Multiple&multiple=Multiple3&check=check2&radio=radio1

序列化表格内容为对象数组

$('form').serializeArray()//["name":"single","value":"Single"}{"name":"multiple","value":"Multiple"}{"name":"multiple","value":"Multiple3"}{"name":"check","value":"check2"}{"name":"radio","value":"radio1"}]

jquery data 选择器 表格序列化serialize()的更多相关文章

  1. jQuery中的serializer序列化—炒鸡好用

    jQuery.serializer()序列化 serialize()函数用于序列化一组表单元素,将表单内容编码为用于提交的字符串. serialize()函数常用于将表单内容序列化,以便用于AJAX提 ...

  2. jQuery源码解读 - 数据缓存系统:jQuery.data

    jQuery在1.2后引入jQuery.data(数据缓存系统),主要的作用是让一组自定义的数据可以DOM元素相关联——浅显的说:就是让一个对象和一组数据一对一的关联. 一组和Element相关的数据 ...

  3. HTML5 自定义属性 data-* 和 jQuery.data 详解

    新的HTML5标准允许你在普通的元素标签里,嵌入类似data-*的属性,来实现一些简单数据的存取.它的数量不受限制,并且也能由javascript动态修改,也支持CSS选择器进行样式设置.这使得dat ...

  4. jQuery Custom Selector JQuery自定义选择器

    什么是JQuery的选择器呢,详见JQuery中的Selector: http://docs.jquery.com/Selectors 比如 $("div:contains('John')& ...

  5. jQuery.data() 的实现方式,jQuery16018518865841457738的由来,jQuery后边一串数字的由来

    原文地址: http://xxing22657-yahoo-com-cn.iteye.com/blog/1042440 jQuery.data() 的实现方式 jQuery.data() 的作用是为普 ...

  6. 第84天:jQuery动态创建表格

    jQuery动态创建表格 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...

  7. 【jQuery】 选择器

    [jQuery] 选择器 资料: w3school  http://www.w3school.com.cn/jquery/jquery_ref_selectors.asp 1. 标签选择器 : $(& ...

  8. jQuery.data() 的实现方式

    jQuery.data() 的作用是为普通对象或 DOM Element 附加(及获取)数据. 下面将分三个部分分析其实现方式:     1. 用name和value为对象附加数据:即传入三个参数,第 ...

  9. jQuery.data() 存储数据

    jQuery.data() 的实现方式 jQuery.data() 的作用是为普通对象或 DOM Element 附加数据. 以下将分三个部分分析事实上现方式: 1. 用name和value为对象附加 ...

随机推荐

  1. 更改已经签名的app中的内容

    转载请说明出处http://blog.csdn.net/andywuchuanlong 记得上次在南昌中兴的一个项目中遇到过一个这种需求:一个app能够给多个渠道商去运营,渠道商推广出去能够获得对应的 ...

  2. vue2 + typescript2 项目开发(环境配置)

    Vue 引入 TypeScript vue init airyland/vux2 projectName 增加开发包的依赖 npm install typescript ts-loader --sav ...

  3. Golang Map Addressability

    http://wangzhezhe.github.io/blog/2016/01/22/golangmapaddressability-dot-md/ 在golang中关于map可达性的问题(addr ...

  4. c语言-递推算法1

    递推算法之一:倒推法 1.一般分析思路: if 求解初始条件F1 then begin { 倒推 } 由题意(或递推关系)确定最终结果Fn; 求出倒推关系式Fi-1 =G(Fi ); i=n; { 从 ...

  5. Redux作用

    作用:Redux是为了解决React中组件与组件之间数据传递的问题. React组件之间的传递有三种情况:1.父组件传递数据给子组件:由于redux是一个单向数据流的框架,所以它的数据就只能由父组件传 ...

  6. g++ 6.4编译opencv-2.4.10报错记录

      fetch公司的项目进行编译,此项目依赖opencv库.由于本人一直比较偏爱fedora,但也因此给我带来了许多"乐趣"(麻烦).fedora一直走得比较前沿,g++ 6.3了 ...

  7. MVC上传多张图片

    改变上传文件的按钮样式: <div id="post-upload-image"> <div id="divfile_-1"> < ...

  8. 动态控制body最小高度

    //动态控制body最小高度 var windowHeight = $(document).height() - 164; $(".body-content").css({ &qu ...

  9. Android组件系列----ContentProvider内容提供者【4】

    (4)单元測试类: 这里须要涉及到另外一个知识:ContentResolver内容訪问者. 要想訪问ContentProvider.则必须使用ContentResolver. 能够通过ContentR ...

  10. 02 php生成xml数据

    <?php class Response_xml{ /** *按xml方式输出通信 *@param integet $code 状态码 *@param string $message 提示信息 ...