JQuery入门

最新推荐文章于 2024-08-09 02:16:38 发布

云飞扬°

最新推荐文章于 2024-08-09 02:16:38 发布

阅读量1k

点赞数

分类专栏： JQuery 文章标签： JQuery入门

本文链接：https://blog.csdn.net/weixin_44706512/article/details/90295401

版权

JQuery 专栏收录该内容

14 篇文章 0 订阅

订阅专栏

JQuery入门

什么JQuery:

jQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（或JavaScript框架）。jQuery设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理、动画设计和Ajax交互。

jQuery的核心特性可以总结为：具有独特的链式语法和短小清晰的多功能接口；具有高效灵活的css选择器，并且可对CSS选择器进行扩展；拥有便捷的插件扩展机制和丰富的插件。jQuery兼容各种主流浏览器，如IE 6.0+、FF 1.5+、Safari 2.0+、Opera 9.0+等

JQuery的作用:

1. 写更少的代码,做更多的事情: write Less ,Do more

2. 将我们页面的JS代码和HTML页面代码进行分离

JQ的开发步骤: (将我们页面的JS代码和HTML页面代码进行分离)

1. 导入JQ相关的文件
2.  文档加载完成事件: $(function)  : 页面初始化的操作: 绑定事件, 启动页面定时器
3. 确定相关操作的事件
4. 事件触发函数
5. 函数里面再去操作相关的元素

JQ的入门

首先要向项目文件夹下的js文件夹中导入js库jquery-1.11.0

然后在script中导入这个文件

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<!--导包,引入JQ的文件-->
		<script type="text/javascript" src="../../js/jquery-1.11.0.js" ></script>
		
		<script>
			//js文档加载完成的事件
			window.onload = function(){
				alert("window.onload   111");
			}
			
			window.onload = function(){
				alert("window.onload   222");
			}
			
			/*文档加载完成的事件*/
			jQuery(document).ready(function(){
			 	alert("jQuery(document).ready(function()");
			});
			/*
			 	jQuery  简写成 $
			 */
			$(document).ready(function(){
			 	alert("$(document).ready(function()");
			});
			
			/*
				最简单的写法 
			*/
			$(function(){
				alert("$(function(){");
			});
			
		</script>
	</head>
	<body>
	</body>
</html>