?
Jquery 是继 prototype 之后又一个优秀的 Javascrīpt 框架。
Jquery 的优势：
1.???????? 它是轻量级的 js 库
2.???????? 它兼容 CSS3
3.???????? 还兼容各种浏览器 （ IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+ ）
4.???????? jQuery 使用户能更方便地处理 HTML documents 、 events 、实现动画效果，并且方便地为网站提供 AJAX 交互。
Jquery 中层次的元素的关系：
Js 中代码：
<script>
/**
层次元素关系
1、祖先关系 空格符号
2、父子关系 大于符号
3、紧跟的关系 +符号
4、紧跟后的所有兄弟关系 ~符号
CSS样式
1、css("");带有一个参数是获取其属性的值
2、css("","");为其对象设置一个指定的属性和属性值
3、css(properties);把一个“名/值对”对象设置为所有匹配元素的样式属性 {"":"","":""...};
*/
$(document).ready(function(){
/**层级元素选择器的使用方式*/
/**祖先关系 符号为===>空格*/
var $frmipts = $("div input");//获取div元素的后代的所有input的元素 返回一个Jquery对象
/**输出Jquery对象的大小*/
alert("后代个数是："+$frmipts.size());
/**父子关系 符号为===>>*/
var $ipt = $("form>input");
//为你获取的input添加背景颜色
/**采用Jquery对象转换成DOM对象后使用style样式进行设置的*/
var iptt = $ipt[0];
iptt.style.backgroundColor="red";
alert("-----------改变中介线---------------");
/**采用Jquery对象本身的css方法来设置样式*/
$ipt.css("background-color","blue");
/**匹配所有紧接在某个元素后的某个元素 符号为===> +*/
var $lipts=$("label+input");
/**为其添加背景颜色*/
$lipts.css("background-color","green");
/**匹配 prev 元素之后的所有 siblings(兄弟) 元素 符号为====> ~*/
var $fipts = $("form~input");
$fipts.css("background-color","yellow");
/**我使用到了CSS样式
.css("")//获取其样式属性的值
案例： $fipts.css("background-color");
.css("","") //为其添加样式属性及属性值
$fipts.css("background-color","yellow");
.css(Map);//把一个“名/值对”对象设置为所有匹配元素的样式属性。
$fipts.css({"background-color":"red","color":"blue"});
*/
alert("获取该Jquery对象的背景颜色值："+$fipts.css("background-color"));
});
</script>
?
页面中的代码：
<body> <div> <div> <input name="ddd"/> <h1>层级选择器的使用方式</h1> </div> <div id="#frm"> 邮箱：<input name="test"/> <form> <label>Name: </label> <input name="name"/> <fieldset> <label>Newsletter: </label> <input name="newsletter" /> </fieldset> <label>Age: </label> <input name="age"/> </form> <label>周星驰: </label>br/> 姓名：<input name="none" /><br/> </div> </div> </body>