- 1、本文档共15页,可阅读全部内容。
- 2、原创力文档(book118)网站文档一经付费(服务费),不意味着购买了该文档的版权,仅供个人/单位学习、研究之用,不得用于商业用途,未经授权,严禁复制、发行、汇编、翻译或者网络传播等,侵权必究。
- 3、本站所有内容均由合作方或网友上传,本站不对文档的完整性、权威性及其观点立场正确性做任何保证或承诺!文档内容仅供研究参考,付费前请自行鉴别。如您付费,意味着您自己接受本站规则且自行承担风险,本站不退款、不进行额外附加服务;查看《如何避免下载的几个坑》。如果您已付费下载过本站文档,您可以点击 这里二次下载。
- 4、如文档侵犯商业秘密、侵犯著作权、侵犯人身权等,请点击“版权申诉”(推荐),也可以打举报电话:400-050-0827(电话支持时间:9:00-18:30)。
- 5、该文档为VIP文档,如果想要下载,成为VIP会员后,下载免费。
- 6、成为VIP后,下载本文档将扣除1次下载权益。下载后,不支持退款、换文档。如有疑问请联系我们。
- 7、成为VIP后,您将拥有八大权益,权益包括:VIP文档下载权益、阅读免打扰、文档格式转换、高级专利检索、专属身份标志、高级客服、多端互通、版权登记。
- 8、VIP文档为合作方或网友上传,每下载1次, 网站将根据用户上传文档的质量评分、类型等,对文档贡献者给予高额补贴、流量扶持。如果你也想贡献VIP文档。上传文档
查看更多
jQuery基础教程一(传说中的ready)
首先我们来说明一下什么是Jquery
jQuery 是一个新型的JavaScript库.
jQuery是一个简洁快速的JavaScript库,它能让你在你的网页上简单的操作文档、处理事件、运行动画效果或者添加Ajax交互。jQuery的设计会改变你写JavaScript代码的方式。
jQuery适合于设计师、开发者以及那些还好者,同样适合用于商业开发,可以说jQuery适合任何JavaScript应用的地方,可用于不用的应用程序。
jQuery是一个轻量级的脚本,其代码非常小巧,JavaScript包只有15K左右。
jQuery支持CSS1-CSS3,以及基本的xPath
jQuery是跨浏览器的,它支持的浏览器包括IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+
第一步 ready函数
如果你需要一些函数需要在DOM加载就绪以后才能执行,当然window.onload()能实现同样的功能,但当window.onload函数执行的时候,要说明所有东西已经载入,包括图像和横幅等等。要知道较大的图片下载速度会比较慢,因此用户必须等待大图片下载完毕才能看到window.onload()执行的代码效果,这样就花费了很长的等待时间,这不是我们想要的.
$(document).ready(fn):当DOM载入就绪可以查询及操纵时绑定一个要执行的函数。这是事件模块中最重要的一个函数,因为它可以极大地提高web应用程序的响应速度。 简单地说,这个方法纯粹是对向window.load事件注册事件的替代方法。通过使用这个方法,可以在DOM载入就绪能够读取并操纵时立即调用你所绑定的函数.
(document)意思是说,获取整个网页文档对象(类似的于window.document),$(document).ready意思就是说,获取文档对象就绪的时候。
$(document).ready(function() {
// do stuff when DOM is ready//当文档载入后从此处开始执行代码
});
jquery基础教程二(鼠标点击事件)
下面我们来看看jquery如何给 DOM 各个元素批量绑定事件
SCRIPT LANGUAGE=JavaScript
!--
$(document).ready(function() {
$(div).click(function(){//$(div)就是页面中所有的 div标签
alert(Hello World!);
})
})
//--
/SCRIPT
$(div).click $(div)就是页面中所有的 div标签 这句话就是给所有的标签为div的元素 绑定了一个click事件 即当所有div 被鼠标单击的时候 执行 alert(Hello World!);
例子:
html
head
meta http-equiv=Content-Type content=text/html; charset= gb2312 /
titlejquery基础教程二(demo鼠标点击事件)/title
script language=javascript src=/demo/jquery.js/script
SCRIPT LANGUAGE=JavaScript
!--
$(document).ready(function() {
$(div).click(function(){
alert(Hello World!);
})
})
//--
/SCRIPT
/head
body
divHello World!/div
/body
/html
jquery基础教程三(css的操作之addClass和removeClass)
下面我们看看jquery对css的操作方法 addClass和removeClass
1)addClass:为每个匹配的元素添加指定的类名。
2)removeClass:为每个匹配的元素移除指定的类名。
SCRIPT LANGUAGE=JavaScript
!--
$(document).ready(function() {
$(div).addClass(redborder);//当页面加载完成后给每个div标签 加上 redborder样式
$(div).click(function(){
$(this).removeClass(redborder);//当鼠标单击div标签的时候 移除当前div标签的redborder样式
})
})
//--
/SCRIPT
您可能关注的文档
最近下载
- 网络空间信息安全(第2版)习题与思考题参考答案.pdf
- 微肿瘤PTC体外药敏检测服务2023年.pdf VIP
- 教科版四年级科学上册第三单元《第1课让小车运动起来》优秀教学设计.docx VIP
- 病例报告表完整版.doc
- 电影售票管理平台.docx
- 统编版语文三年级上册《对话中提示语的位置及标点》课件.pptx VIP
- AQ_ 4272-2016 铝镁制品机械加工粉尘防爆安全技术规范.pdf
- 4第四章-金融市场及其构成(货币金融学(蒋先玲编著)第3版ppt课件可编辑).pptx
- 部编版语文二年级下册 第三单元大单元任务群“发现汉字的秘密”(一等奖创新教学设计).pdf VIP
- 《活着》读书分享.pptx VIP
文档评论(0)