当前位置: 首页 > 图文教程 > 网络编程 > Javascript > Jquery 学习笔记(二)

Javascript
IE8 原生JSON支持
iframe 自适应高度[在IE6 IE7 FF下测试通过]
javascript 清除输入框中的数据
IE和FireFox(FF)中js和css的不同
JavaScript asp.net 获取当前超链接中的文本
用JavaScript页面不刷新时全选择,全删除(GridView)
JavaScript获取GridView选择的行内容
javaScript 读取和设置文档元素的样式属性
js select 控制实现代码
javascript 类方法定义还是有点区别
jQuery 绝对入门
网页开发中的容易忽略的问题 javascript HTML中的table
childNodes 用法两例
js 只能输入数字和小数点的文本框改进版
javascript 09年最新版的省市联动
jquery 实现的全选和反选
js 拖拽翻页实现代码
保证JavaScript和Asp、Php等后端程序间传值编码统一
JavaScript 无符号右移赋值操作
JavaScript 无符号右移运算符

Javascript 中的 Jquery 学习笔记(二)


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2010-01-10   浏览: 431 ::
收藏到网摘: n/a

从最开始看到Jquery这样的选择器就让我想起了CSS的选择器,简直是同出一辙啊,CSS的选择器语法个人觉得相当的经典,那么Jquery借鉴CSS也就没有多少疑问了。 选择器
从最开始看到Jquery这样的选择器就让我想起了CSS的选择器,简直是同出一辙啊,CSS的选择器语法个人觉得相当的经典,那么Jquery借鉴CSS也就没有多少疑问了。
还是复习一下Jquery的选择器吧

其中h1为选择器,color:red与background:#d00与声明,两者结合也即{}内称为声明块;color与background称为属性;red与#d00称为值。
其中选择器类别可分为以下类别:
标签选择器:p{CSS rules}
id选择器:#ID{CSS rules}
类选择器:.Class{CSS rules}
群组选择器:h1,h2,h3,h4,h5,h6{CSS rules}
后代选择器:div p{CSS rules}
通配选择器:*{CSS rules}
伪类选择器:a:link,a:visited{CSS rules}
另还有不常使用的多类选择器、属性选择器、部分属性选择器、相邻兄弟选择器、子选择器等,详细可参与《CSS权威手册》这本书或者http://www.w3.org/TR/CSS2/selector.html。
相对应,理解Jquery中$("#ID")就不是难事了。
Jquery中基本选择器包括*,class,element,id及这种群组方式selector1,selector2,…
还是看下综合实例

[Ctrl+A 全选 提示:你可先修改部分代码,再按运行]


2、层次选择器
不用说,层次选择器的思想来自CSS;实际上稍微拓展了
$("div span")//选择<div>里所有<span>元素
$("div>span")//选择<div>元素下元素名为<span>的元素
$('prev+next')//选择紧接在prev元素后的next元素
$('prev~siblings‘)//选择prev元素之后的所有sibling元素
例:
复制代码 代码如下:

$(function(){
$("ul li").css("color","#f00");
$("div>span").css("color","#008000");
$("div+span").css("color","#d00");
$("div~span").css("background","#ffc");
});
</script>
</head>
<body>
<div>
<span>文字一</span>
</div>
<span>文字二</span>
<span>文字三</span>
<ul>
<li>选项一</li>
<li>选项二</li>
<li>选择三</li>
</ul>