JQuery入门
程序员文章站
2022-07-14 22:52:13
...
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>