- 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 >的意义是：在文档加载完毕后会执行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) 给元素删除指定类
时间： 2024-08-24 18:45:33