jQuery_day01(基础语法).docVIP

day01：jQuery基础入门 学习要点： jQuery简介 jQuery是什么？ jQuery是一个JavaScript函数库jQuery库 - 特性jQuery库包含以下特性： HTML元素选取 HTML元素操作 CSS操作 HTML事件函数 JavaScript特效和动画 HTML DOM遍历和修改 AJAX 下载 jQuery/ 共有两个版本的jQuery可供下载：一份是精简过的jquery-1.8.3.min.js 另一份是未压缩的（供调试或阅读）jquery-1.8.3.js 向您的页面添加jQuery库jQuery库位于一个JavaScript文件中，其中包含了所有的jQuery函数 可以通过下面的标记把jQuery添加到网页中： head script type=text/javascript src=jquery.js/script /head 请注意，script标签应该位于页面的head部分demo01-js.html 用原生JavaScript实现 !DOCTYPE html PUBLIC -//W3C//DTD HTML 4.01 Transitional//EN /TR/html4/loose.dtd html head meta http-equiv=Content-Type content=text/html; charset=UTF-8 titledemo/title script type=text/javascript function hideOrShow() { //获取html页面所有的p元素的dom对象 var allPs = document.getElementsByTagName(p); //循环 for(var i = 0 ; i allPs.length ; i ++) { //判断是显示/隐藏 if(allPs[i].style.display==||allPs[i].style.display==block) { allPs[i].style.display = none; } else { allPs[i].style.display = block; } } } /script /head body center h2用JavaScript显示/隐藏所有段落/h2 p段落1：点击下面的按钮我将被隐藏..../p p段落2：点击下面的按钮我将被隐藏..../p button onclick=hideOrShow()点击/button /center /body /html 示例：demo01-jq.html 用jQuery实现 !DOCTYPE html PUBLIC -//W3C//DTD HTML 4.01 Transitional//EN /TR/html4/loose.dtd html head meta http-equiv=Content-Type content=text/html; charset=UTF-8 titledemo/title script type=text/javascript src=script/jquery-1.8.3.js/script script type=text/javascript $(function() { $(button).click(function () { //获取所有的p元素，jQuery对象 //调用jQuery对象的toggle方法：显示或者隐藏元素 $(p).toggle(); }); }); /script /head body center h2用jQuery显示/隐藏所有段落/h2 p段落1：点击下面的按钮我将被隐藏..../p p段落2：点击下面的按钮我将被隐藏..../p button点击/button /center /body /html jQuery 基本语法 文档就绪函数demo02-js.html window.onload = function(){ ... } 访问HTML文档的元素，必须先载入文档对象模型(DOM) 当window.onload函数执行的时候，说明所有东西已经载入，包括图像和横幅等等 要知道较大的图片下载速度会比较慢，因此用户必须等待大图片下载完毕才能看到window.onload()执行的代码效果，这样就花费了很长的等待时间，这不是我们想要的 对于此，jquery提供了一个ready事件,你可以使用以下的代码片段 示例：demo02-jq.html $(document).ready(function(){ /