jQuery学习笔记之Helloworld


Posted in Javascript onDecember 22, 2010

jQuery是什么?

jQuery由美国人John Resig创建,至今已吸引了来自世界各地的众多javascript高手加入其team,包括来自德国的Jörn Zaefferer,罗马尼亚的Stefan Petre等等。jQuery是继prototype之后又一个优秀的Javascrīpt框架。其宗旨是——WRITE LESS,DO MORE,写更少的代码,做更多的事情。它是轻量级的js库(压缩后只有21k) ,这是其它的js库所不及的,它兼容CSS3,还兼容各种浏览器 (IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+)。jQuery是一个快速的,简洁的javaScript库,使用户能更方便地处理HTML documents、events、实现动画效果,并且方便地为网站提供AJAX交互。jQuery还有一个比较大的优势是,它的文档说明很全,而且各种应用也说得很详细,同时还有许多成熟的插件可供选择。jQuery能够使用户的html页保持代码和html内容分离,也就是说,不用再在html里面插入一堆js来调用命令了,只需定义id即可。

jQuery的构成?

通过 jQuery,您可以选取(查询,query) HTML 元素,并对它们执行“操作”(actions)。如图:

jQuery学习笔记之Helloworld
helloworld!

简单熟悉了jQuery的构成,我先写一个helloworld!

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>1-1</title> 
<!-- 引入 jQuery --> 
<script src="../scripts/jquery-1.3.1.js" type="text/javascript"></script> 
<script type="text/javascript"> 
//等待dom元素加载完毕. 
$(document).ready(function(){ 
alert("Hello World!"); 
}); 
</script> 
</head> 
<body> 
</body> 
</html>

1.其中 :<script src="../scripts/jquery-1.3.1.js" type="text/javascript"></script>

本句是引入jQuery库文件,本文件可以到http://jQuery.com网站下载

2.代码:

<script type="text/javascript"> 
//等待dom元素加载完毕. 
$(document).ready(function(){ 
alert("Hello World!"); 
}); 
</script>

$(document).ready(function(){})相当于JS中的windows.onload方法,再文档加载完毕时执行,
在jQuery中"$()"符号就相当于"jQuery()"
$(document).ready(function(){})可以简写为$(function(){})
Javascript 相关文章推荐
鼠标滚轮控制网页横向移动实现思路
Mar 22 Javascript
Javascript 遮罩层和加载效果代码
Aug 01 Javascript
jQuery Animation实现CSS3动画示例介绍
Aug 14 Javascript
详解JavaScript中setSeconds()方法的使用
Jun 11 Javascript
详解微信小程序开发之下拉刷新 上拉加载
Nov 24 Javascript
jQuery实现拖拽可编辑模块功能代码
Jan 12 Javascript
JS 实现随机验证码功能
Feb 15 Javascript
利用C/C++编写node.js原生模块的方法教程
Jul 07 Javascript
Vue通过URL传参如何控制全局console.log的开关详解
Dec 07 Javascript
vue2.0 循环遍历加载不同图片的方法
Mar 06 Javascript
Vue.set()动态的新增与修改数据,触发视图更新的方法
Sep 15 Javascript
详解webpack+ES6+Sass搭建多页面应用
Nov 05 Javascript
用Jquery实现多级下拉框无刷新的联动
Dec 22 #Javascript
一个轻量级的javascript库 pj介绍
Dec 19 #Javascript
JavaScript Date对象 日期获取函数
Dec 19 #Javascript
jQuery UI Datepicker length为空或不是对象错误的解决方法
Dec 19 #Javascript
jQuery UI Dialog控件中的表单无法正常提交的解决方法
Dec 19 #Javascript
超酷的网页音乐播放器DewPlayer使用方法
Dec 18 #Javascript
有关js的变量作用域和this指针的讨论
Dec 16 #Javascript
You might like
PHP个人网站架设连环讲(二)
2006/10/09 PHP
php的无刷新操作实现方法分析
2020/02/28 PHP
关于用Jquery的height()、width()计算动态插入的IMG标签的宽高的问题
2010/12/08 Javascript
jQuery 自定义函数写法分享
2012/03/30 Javascript
利用jquery写的左右轮播图特效
2014/02/12 Javascript
jquery如何判断表格同一列不同行input数据是否重复
2014/05/14 Javascript
jquery 实现两Select 标签项互调示例代码
2014/09/25 Javascript
Js为表单动态添加节点内容的方法
2015/02/10 Javascript
浅谈node.js中async异步编程
2015/10/22 Javascript
使用jquery提交form表单并自定义action的方法
2016/05/25 Javascript
浅谈JavaScript正则表达式-非捕获性分组
2017/03/08 Javascript
js实现音乐播放控制条
2017/09/09 Javascript
Vue2.0子同级组件之间数据交互方法
2018/02/28 Javascript
Vue表单类的父子组件数据传递示例
2018/05/03 Javascript
关于JavaScript中高阶函数的魅力详解
2018/09/07 Javascript
vue中获取滚动table的可视页面宽度调整表头与列对齐(每列宽度不都相同)
2019/08/17 Javascript
vue使用微信扫一扫功能的实现代码
2020/04/11 Javascript
详解Vue 数据更新了但页面没有更新的 7 种情况汇总及延伸总结
2020/05/28 Javascript
解决vue做详情页跳转的时候使用created方法 数据不会更新问题
2020/07/24 Javascript
Windows下Anaconda的安装和简单使用方法
2018/01/04 Python
python3.x实现发送邮件功能
2018/05/22 Python
python 遗传算法求函数极值的实现代码
2020/02/11 Python
SpringBoot实现登录注册常见问题解决方案
2020/03/04 Python
Python如何利用Har文件进行遍历指定字典替换提交的数据详解
2020/11/05 Python
python urllib和urllib3知识点总结
2021/02/08 Python
Rockport乐步美国官网:风靡美国的白宫鞋
2016/11/24 全球购物
澳大利亚拥有最佳跳伞降落点和最好服务的跳伞项目运营商:Skydive Australia
2018/03/05 全球购物
Weblogic和WebSphere不同特点
2012/05/09 面试题
在校生党员自我评价
2013/09/25 职场文书
成考报名单位证明范本
2014/01/16 职场文书
经销商订货会主持词
2014/03/27 职场文书
需求分析说明书
2014/05/09 职场文书
财务部副经理岗位职责范本
2014/06/17 职场文书
2015年初中元旦晚会活动总结
2014/11/28 职场文书
2016年“5.12”护士节慰问信
2015/11/30 职场文书
利用Python判断整数是否是回文数的3种方法总结
2021/07/07 Python