- jQuery-API帮助文档:Click here
- jQuery简介
jQuery是JavaScript框架，jQuery也是JavaScript代码。使用jQuery要比直接使用JavaScript方便很多。
要使用jQuery，首先需要在jsp页面中导入jQuery。jQuery就是一个js文件而已。
导入jQuery有三种方法：
1 <!-- 导入c标签库 --> 2 <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> 3 <!-- 1. --> <script type="text/javascript" src="<c:url value='/jquery-1.5.1.js'/>"></script><!-- 标签，需导入c标签库 --> 4 <!-- 2. --> <script type="text/javascript" src="/项目名/jquery-1.5.1.js"></script> 5 <!-- 3. --> <script type="text/javascript" src="${pageContext.request.contextPath}/jquery-1.5.1.js"></script>
- jQuery核心函数
$()
注意其不同于${}
顺便记一下${}的用法吧：
1 这是一个EL表达式取值的方法 2 例如： 3 比如有A页面请求B页面，在A页面中有一句这样的代码 4 String name = "测试"; 5 request.setAttribute("name",name); 6 7 那么B页面中将这样可以去到name中的数据 8 ${name} 9 这个输出的值是 测试 10 11 当然不一定要放在request中可以去到，同样放在page session一样也可以去到。 12 但取值是有优先级的 page->request->session等
- 事件之文档加载完毕
在JavaScript中<body onload="xxx()">的意义是：在文档加载完毕后会执行xxx()函数。在jQuery中也存在相同的功能，即：$(function(){..}); 给$()这个参数赋值，参数为一个匿名函数，这个匿名函数会在文档加载完毕时执行。
1 <script type="text/javascript"> 2 $(function(){ 3 alert('我叫郑斌'); 4 }); 5 </script>
- 选择器
在JavaScript中获取元素可以使用document.getElementByld()等函数，但在jQuery中提供了更为方便的方法。
1 <script type="text/javascript"> 2 $(function(){ 3 //document.getElementById("id")//返回一个DOM对象，但 DOM的功能少 4 var hey = $("#Hanxue");//返回一个jQuery对象 '#'表示元素选择器 '.'表示类选择器 5 alert(hey.text());//打印出该元素的文本内容 6 alert(hey.html());//打印该元素HTML内容 7 var ni = $("div");//元素选择器，查找所有的div元素，它返回的是一个jQuery对象，但jQuery中包含多个DOM对象。 8 alert(ni.text()); 9 10 $(".myClass").text("88");//类选择器 11 }); 12 </script> 13 </head> 14 <body> 15 This is my JSP page. <br> 16 <!-- 供 元素选择器 --> 17 <div id="Zhengbin"><p>zhengzhou</p></div> 18 <div id="Hanxue"><p>kunming</p></div> 19 <!-- 供 类选择器 --> 20 <div class="myClass">div class="myClass"</div> 21 <span class="myClass">span class="myClass"</span> 22 </body>
- 属性
jQuery元素对属性的操作方法：
-
- attr(name) 读取指定属性的值
- attr(name,value) 设置指定属性的值
- removeAttr(name) 删除指定属性
- 类
jQuery元素对类的操作方法：
-
- addClass(name) 给元素添加指定类
- removeClass(name) 给元素删除指定类