查看文章 |
说它轻量 其实一点也不轻量,这个库的语法太酷了 极大减少代码编写量,提高代码与页面的分离度.看个例子先 先加入类库 <script src="lib/jquery.js" type="text/javascript"></script> <script> $(document).ready(function(){ $("#faq").find("dd").hide().end().find("dt").css("cursor","hand").click(function(){ }); </script> <div id="faq"> <dt>问题2</dt> <dt>问题3</dt>
能看出上边的js代码作了什么工作吗? 没错. 当点击dt元素时 开关下面的答案.slideUp(1000)函数中的1000是1000毫秒 . 代码少吧?再举个例子,大家在很多站点估计都看到过这样的效果, 当输入框获得焦点时候,边框颜色改变加亮,当离开输入框时,边框颜色还原 以前我们可能在每个<input type="text">里加上 onfocus="this.className='red'" onblur="this.className='blue'" ,是不是很麻烦? 利用Jquery我们可以这样写 $("input[@type=text],textarea").addClass("blue") .focus(function(){$(this).removeClass("blue");$(this).addClass("red")}) .blur(function(){$(this).remove("red");$(this).addClass("blue")}); 这句代码不但所有text类型的input框 甚至包括textarea多文本框都一步实现了这样的效果. Is it cool enough? 想更多了解JQuery库,去Baidu 或 Google下吧 jQuery Docs - 1.1 API 中文版http://jquery.org.cn/api/cn/index.xml |