day04-jquery解析.doc

jQuery jQuery入门 javascript类库 JavaScript 库封装了很多预定义的对象和实用函数。能帮助使用者建立有高难度交互客户端页面, 并且兼容各大浏览器。 当前流行的 JavaScript 库有： jQuery 使用非常多了 EXTJS 功能比jQuery更多，但ext2.0收费 Prototype 一般用于做框架 YUI! (Yahoo! User Interface) Bootstrap，来自 Twitter，是目前很受欢迎的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的，它简洁灵活，使得 Web 开发更加快捷 jQuery介绍 ?jQuery是继prototype之后又一个优秀的Javascript库。它是轻量级的js库 ，它兼容CSS3，还兼容各种浏览器。 ?jQuery已经成为最流行的javascript库，在世界前10000个访问最多的网站中，有超过55%在使用jQuery。由美国人John Resig在2006年1月发布 ?jQuery是免费、开源的 ?jQuery分类： WEB版本：我们主要学习研究 （jQuery-版本.js 、 jQuery-版本-min.js） UI版本：集成了UI组件 mobile版本：针对移动端开发 qunit版本：用于js测试的 jquery官网 / 我们接触到的版本 导入jQuery 通过script标签的src属性导入即可 jQuery基本操作 获得jQuery对象 语法：$(选择器或者DOM对象) 或 jQuery(选择器或者DOM对象) $ == jQuery script type=text/javascript // $() 语法，建议：如果是jQuery对象变量名使用$作为前缀 var $obj = $(#username); // val() 函数 获得 value属性的值 alert($obj.val()); /scriptscript type=text/javascript //1将dom对象 转换 jquery对象 //先获得dom对象 var obj = document.getElementById(username); //alert(obj.value); var $obj = $(obj); //获得value的值 //alert($obj.val()); //jquery 对象 转换 dom 对象 //先通过 $(...) 获得jQuery对象，底层使用数组进行维护的，可以存放多个对象。 //然后通过get()可以从jquery对象转换成 dom对象。参数：数组的下标，可以省略。如果省略下标获得dom 数组。 var obj2 = $obj.get(0); //alert(obj2.value); // 底层是数组，通过下标获得dom对象 alert($obj[0].value); /script 子元素过滤 ：nth-child() 指定孩子 ，从1开始。 ：first-child 第一个孩子 ：last-child 最后一个孩子 ：only-child 自己是唯一的孩子 表单过滤 ：input 表示所有的表单元素（input, textarea, select 和 button） ：text 文本 input type=text ：password 密码 input type=password ：radio 单选 input type=radio ：checkbox 复选框 ：submit 提交 ：image 按钮，可以显示图片 ：reset 重置 ：button 按钮 input type=button 或 button ：file 文件上传 ：hidden input type=hidden div style=display:none; br/(存在浏览器兼容问题) 表单对象属性过滤 ：enabled 可以使用 ：disabled 不可使用 ：checked 选中的元素(单选框和多选框) ：selected 选中的元素(下拉选) 属性和样式 属性,类class,html代码/文本/值,css,位置,尺寸 属性 attr(name) 通过属性名获得属性值。标签 属性名=“属性值” attr(key,val) 给指定的属性设置值。（设置一个） attr(pro) 给jQuery对象设置一组值。使用JSON格式。 {key:value , key : value , .....} ke