JQuery基础选择器.docx

jQuery入门什么是jQueryjQuery是一个JavaScript库，通过封装原生的JavaScript函数得到一整套定义好的方法。它是JohnResig于2006年创建的一个开源项目，随着越来越多开发者的加入，jQuery已经集成了JavaScript、CSS、DOM和Ajax于一体的强大功能。以最少的代码，完成更多复杂而困难的功能，从而得到了开发者的青睐。主旨：以更少的代码、实现更多的功能（write less ,do more!）官网：/jQuery的功能和优势jQuery作为JavaScript封装的库，它的目的就是为了简化开发者使用JavaScript。主要功能有以下几点：像CSS那样访问和操作DOM；修改CSS控制页面外观；简化JavaScript代码操作；事件处理更加容易；各种动画效果使用方便；让Ajax技术更加完美；基于jQuery大量插件；自行扩展功能插件。jQuery最大的优势，就是特别的方便。比如模仿CSS获取DOM，比原生的JavaScript要方便太多。并且在多个CSS设置上的集中处理非常舒服，而最常用的CSS功能又封装到单独的方法。最重要的是jQuery的代码兼容性非常好，你不需要总是头疼着考虑不同浏览器的兼容问题。其他JavaScript库目前除了jQuery，还有5个JS库较为流行，他们分别是YUI、Prototype、Mootools、Dojo和ExtJS。YUI，是雅虎公司开发的一套完备的、扩展性良好的富交互网页工具集。Prototype，是最早成型的JavaScript库之一，对JavaScript内置对象做了大量的扩展。Dojo，Dojo强大之处在于提供了其他库没有的功能。离线存储、图标组件等等。Mootools，轻量、简洁、模块化和面向对象的JavaScript框架。ExtJS，简称Ext，原本是对YUI的一个扩展，主要创建前端用户界面。(付费的)jQuery代码的编写配置jQuery环境1、获取jQuery最新版本从官网下载：/2、jQuery库的类型说明名称大小说明jQuery.js约229K完整无压缩版本，主要用于测试、学习和开发jQuery.min.js约31K经过工具压缩或经过服务器的开启Gzipyasuo ，主要用于产品和项目3、jQuery环境配置jQuery不需要安装，把下载的jQuery.js放到网站上的一个公共位置，想要在某个页面上使用jQuery时，只需在该HTML文档中引入该库文件即可。4、在页面中引入jQuery由于jQuery是JavaScript的一个库文件，也就是jQuery本质是一个.js文件，所以使用script type=”text/javascript” src=”jQuery存放的路径”/script引入。简单的jQuery示例!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01 Transitional//EN /TR/html4/loose.dtdhtmlhead titleJQuery练习/title meta content=text/charset=utf-8 http-equiv=content-typescript type=text/javascript src=./js/jquery-2.1.4.js/scriptscript type=text/javascript//单击按钮弹窗 $(document).ready(function(){$(input).click(function(){alert(第一个JQuery程序);});});/script/headbodyinput type=button id=btn name=btn value=点击我 /body/html效果：点击按钮，弹出对话框。window.onload和$(document).ready区别在jQuery代码中一直在使用$(document).ready(function(){});这段代码进行首尾包裹，那么为什么必须要包裹这段代码呢？原因是我们jQuery库文件是在body元素之前加载的，我们必须等待所有的DOM元素加载后，延迟支持DOM操作，否则jQuery选择器就无法获取到相应的节点元素。延迟等待加载，JavaScript提供了一个事件为load，方法如下：事件或方法说明window.onload=function(){ };//JavaScript等待加载$(document).ready(function(){ }); //jQuery等待加载load和ready区别如下图所示：注意：在实际应用中，很少直接去使用window.onload，因为需要等