jQuery学习笔记之Helloworld
更新时间：2010年12月22日 14:09:52 作者：
刚学习jQuery，觉得有的东西确实有必要写下来，加深下记忆，本文纯属给自己写的，希望大家不要见笑。
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）。如图：
<!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(){})
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）。如图：
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(){})
相关文章
这篇文章主要介绍了jquery预加载图片的方法,涉及jQuery操作图片的相关技巧,需要的朋友可以参考下2015-05-05
客户端的抖动,快速操作,网络通信或者服务器响应慢,都容易造成服务器重复处理,这篇文章主要给大家介绍了关于jquery项目中如何防重复提交的相关资料,需要的朋友可以参考下2021-11-11
这篇文章主要介绍了jQuery实现给input绑定回车事件的方法,结合实例形式分析了2种常用的事件绑定操作技巧,需要的朋友可以参考下2017-02-02
本文主要分享了基于jQuery实现数字滚动效果的示例代码，附源码下载。具有一定的参考价值，下面跟着小编一起来看下吧2017-01-01
利用jQuery.Validate异步验证用户名是否存在（推荐）
这篇文章主要介绍了利用jQuery.Validate异步验证用户名是否存在的相关资料,非常不错，具有参考借鉴价值，需要的朋友可以参考下2016-12-12
这篇文章主要为大家详细介绍了JQuery ztree带筛选、异步加载实例，zTree支持静态 和 Ajax 异步加载节点数据，并支持极其灵活的checkbox或radio选择功能，本文为大家进行具体介绍2016-02-02
在WinForm程序开发中，经常用MessageBox弹出某些提示，功能虽简单但却非常的实用！而在Web页面中，浏览器也提供了Alert或Confirm等脚本语句用于弹出提示窗口2009-12-12
相信大家都见过或使用过放大镜效果，甚至实现过该效果，它一般应用于放大查看商品图片，一些电商网站（例如：凡客，京东商城，阿里巴巴等）都有类似的图片查看效果。那么接下来，我们将向大家介绍通过jQuery实现放大镜效果。2014-09-09
基于HTML+CSS，jQuery编写的简易计算器后续（添加了键盘监听）
这篇文章主要介绍了使用HTML+CSS，jQuery编写的简易计算器后续（添加了键盘监听） 的相关资料,需要的朋友可以参考下2016-01-01
本篇文章主要是对jquery easyui中treegrid用法的简单实例进行了介绍，需要的朋友可以过来参考下，希望对大家有所帮助2014-02-02
最新评论