jQuery介绍

jQuery介绍

---

1.jQuery的认识

jQuery是继prototype原型之后又一个优秀的JavaScript框架(jquery.js库)。
特点：
1） 具有独特的链式语法 和短小清晰的多功能接口；
2） 具有高效灵活的css选择器，并且可对CSS选择器进行扩展；
3） 拥有便捷的插件扩展机制和丰富的插件；
4）兼容性强
jQuery的核心思想:写得更少，做得更多（Write less do more）

2.jQuery的使用

1）正确引入script

2）页面加载事件

3）jQuery===$
/调用标签/
$(“p”).html(“标签已启用”)

	//用jQuery代替$
	jQuery("p").html("用jquery代替$")
	
	以上两个指令效果一致

4）DOM对象与jQuery对象转换
//获取jQuery对象
KaTeX parse error: Expected 'EOF', got '#' at position 3: ("#̲test").html("已启…("#test");
console.log(i);

		console.log("--------------");
		//转换为document对象
		console.log(i[0]);
		i[0].innerHTML="发热个人";
		
		//获取document对象
		var m=document.getElementById("test");
		
		//将document对象转化为jQuery对象
		var mm=$(m);
		mm.html("转换成功")

3.jQuery的选择器

**

	
		
		
		
		
		
	
	
		
周一
		
周二
		
周三
		周四
		
周五
		
		
		

		
西游记
		
dsa
		
水许传
		
红楼梦
		

			三国
			

				
魏
				
蜀
				
吴
			
		
		
孙菲菲如果
		
烦人烦人
	
	
	
	

**

4.jQuery注册事件

/* jQuery注册事件方法：
1）KaTeX parse error: Expected 'EOF', got '#' at position 3: (“#̲id”).click(func…(“#id”).on(“click”,function(){});
取消：KaTeX parse error: Expected 'EOF', got '#' at position 3: (“#̲id”).off(“click…(“#id”).bind(“click”,function(){});
取消：$(“#id”).unbind(“click”);*/

5.jQuery中append的使用

append(content) 向每个匹配的元素内部追加内容。
content String(htmlString),Element(DOM), jQuery对象

	
		
		
		
		
		
	
	
		
测试
		
天气
		周日
		

		
		

		  
		
		

	

6.二级联动jQuery使用

页面：

		省份
		  
		城市
		 
	

JS：

后台代码：

@WebServlet("/list")
public class ListCode extends HttpServlet {

	@Override
	public void service(ServletRequest req, ServletResponse resp) throws ServletException, IOException {
				resp.setContentType("text/html;charset=UTF-8");
				
				String pid = req.getParameter("pid");
				if(pid != null && !"".equals(pid)){
					List cityList = City.getCity(Integer.valueOf(pid));
					JSON cityJson = JSONSerializer.toJSON(cityList);
					resp.getWriter().print(cityJson);
				}else{
					
					List provinceList = Province.getProvince();
					JSON json = JSONSerializer.toJSON(provinceList);
					System.out.println(json);
					
					resp.getWriter().print(json);
				}
	}
}

主要注意：json的使用，中文代码的乱码现象