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 相关文章推荐
在多个页面使用同一个HTML片段的代码
Mar 04 Javascript
JavaScript中定义函数的三种方法
Mar 12 Javascript
基于Bootstrap的UI扩展 StyleBootstrap
Jun 17 Javascript
如何处理JSON中的特殊字符
Nov 30 Javascript
JS实现DIV高度自适应窗口示例
Feb 16 Javascript
JS设置手机验证码60s等待实现代码
Jun 14 Javascript
jquery一键控制checkbox全选、反选或全不选
Oct 16 jQuery
JS 实现缓存算法的示例(FIFO/LRU)
Mar 20 Javascript
微信小程序仿知乎实现评论留言功能
Nov 28 Javascript
element-ui带输入建议的input框踩坑(输入建议空白以及会闪出上一次的输入建议问题)
Jan 15 Javascript
原生JavaScript实现弹幕组件的示例代码
Oct 12 Javascript
jquery插件实现代码雨特效
Apr 24 jQuery
用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
《神奇女侠:血脉》神力女超人大战犯罪公司
2020/04/09 欧美动漫
php在线生成ico文件的代码
2007/10/09 PHP
PHP缓存机制Output Control详解
2014/07/14 PHP
wamp安装后自定义配置的方法
2014/08/23 PHP
PHP中Session可能会引起并发问题
2015/06/26 PHP
实例讲解YII2中多表关联的使用方法
2017/07/21 PHP
指定js可访问其它域名的cookie的方法
2007/09/18 Javascript
jQuery中的.bind()、.live()和.delegate()之间区别分析
2011/06/08 Javascript
Ajax搜索结果页面下方的分页按钮的生成
2012/04/05 Javascript
Node.js模拟浏览器文件上传示例
2014/03/26 Javascript
在Google 地图上实现做的标记相连接
2015/01/05 Javascript
JS实现仿中关村论坛评分后弹出提示效果的方法
2015/02/23 Javascript
详谈javascript中DOM的基本属性
2015/02/26 Javascript
jQuery简单绑定单个事件的方法示例
2017/06/10 jQuery
JS运动特效之同时运动实现方法分析
2018/01/24 Javascript
微信小程序倒计时功能实例代码
2018/07/17 Javascript
小程序实现展开/收起的效果示例
2018/09/22 Javascript
H5+C3+JS实现五子棋游戏(AI篇)
2020/05/28 Javascript
函数式编程入门实践(一)
2019/04/20 Javascript
深入了解JavaScript 私有化
2019/05/30 Javascript
vue 实现把路由单独分离出来
2020/08/13 Javascript
Python写的服务监控程序实例
2015/01/31 Python
python获得一个月有多少天的方法
2015/06/04 Python
python 读取excel文件生成sql文件实例详解
2017/05/12 Python
Python使用matplotlib 模块scatter方法画散点图示例
2019/09/27 Python
Windows下Anaconda安装、换源与更新的方法
2020/04/17 Python
python爬虫使用正则爬取网站的实现
2020/08/03 Python
如何使用canvas绘制可移动网格的示例代码
2020/12/14 HTML / CSS
JackJones官方旗舰店:杰克琼斯男装
2018/03/27 全球购物
俄语专业毕业生推荐信
2013/10/28 职场文书
行政人员岗位职责
2013/12/08 职场文书
吸烟检讨书2000字
2014/02/13 职场文书
2014年党的群众路线教育实践活动总结
2014/04/25 职场文书
委托培训协议书
2014/11/17 职场文书
员工开除通知书
2015/04/25 职场文书
postgresql之greenplum字符串去重拼接方式
2023/05/08 PostgreSQL