前端计划第二天-jQuery基础
2015-11-17 21:04
627 查看
jQuery基础
一.jquery概念
Jquery是一个优秀的Javascript框架。它是轻量级的js库 ,它兼容CSS3,还兼容各种浏览器,jQuery2.0及后续版本将不再支持IE6/7/8浏览器。jQuery使用户能更方便地处理HTML documents、events、实现动画效果,并且方便地为网站提供AJAX交互。jQuery还有一个比较大的优势是,它的文档说明很全,而且各种应用也说得很详细,同时还有许多成熟的插件可供选择。jQuery能够使用户的html页面保持代码和html内容分离,也就是说,不用再在html里面插入一堆js来调用命令了,只需定义id即可。JavaScript的缺点:控件的操作方式不统一,不同浏览器容易出观兼容问题。为了简化操作,出现了许多对JavaScript封装的函数库比如Prototype、JQuery等。
JQuery的优点:小巧、方便、功能强大。插件丰富、开源、免费。
二.基础知识
选择器
JQuery选择器用于查找满足条件的元素,比如可以使用$(“#控件id”)来根据控件id获得控件的JQuery对象。相当于getElementByid。$(“TagName”)来获取所有指定签名的JQuery对象,相当于getElementsByTagName。
CSS选择器,同时选择拥有某个样式的多个元素:
(“.text”).click(function(){alert((this).text();)});
多条件选择器:$(“p,div,span.menuitem”),同时选择p标签、div标签和拥有menuitem样式的span标签。
层次选择器:
1、$(“div li”)获取div下的所有li标签(后代,子、子的子标签…)。
2、$(“div > li”)获取div下的直接li子标签。
3、$(“.menuitem + div”)获取样式名为menuitem之后的第一个div标签。
4、$(“.menuitem ~ div”)获取样式名为menuitem之后的所有div标签。
JQuery过滤选择器
:first选择第一个标签。$(“div:first”)选取第一个
:last选取最后一个标签。$(“div:last”)选取最后一个
:not选取不满足选择器条件的标签。$(“input:not(.myclass)”)选取样式名不是myclass的标签。
:even、:odd,选取索引是奇数、偶数的标签:$(“input:event”)选取索引是奇数的。
:eq、:gt、:lt选取索引等于、大于、小于索引序号的标签,比如$(“input:lt(1)”)选取索引小于1的。
$(“:header”)选取所有的h1…h6标签。
$(“div:animated”)选取正在执行动画的
标签。
属性过滤选择器
$(“div[id]”)选取有id属性的
$(“div[title=test]”)选取title属性为“text”的
$(“div[title!=test]”)选取title属性不为“text”的
表单对象选择器
$(“#form1:enabled”)选取id为form1的表单内所有启用的标签。
$(“#form1:disabled”)选取id为form1的表单内所有禁用的标签。
$(“#form1:checked”)选取所有选中的标签。(checkBox)。
$(“#form1:selected”)选取所有选中的选项
相关文章推荐
- jQuery遮罩插件jQuery.blockUI介绍及使用
- jquery 点击div 以外窗口隐藏的方法
- 以后上午就只能这样了么-jQuery
- Jquery easy ui dataGrid
- jquery中attr和prop的区别
- jquery ajax局部加载方法介绍
- jquery 插件 validate 学习
- jQuery基础语法
- jQuery-1.9.1源码分析系列(九) CSS操作
- jQuery设计思想
- jQuery 动画的执行
- jQuery异步提交与JSON解析
- jQuery整理1
- JQuery AJax序列化元素
- jquery可定制的在线UEditor编辑器
- jquery实现触发、失去焦点操作并执行ajax操作
- javascript与Jquery整理
- jQuery $(document).ready()和JavaScript window.onload()事件的区别
- hammerjs jquery的选项使用方法,以给swipe设置threshold和velocity为例
- Jquery操作Cookie