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 相关文章推荐
js左侧多级菜单动态的解决方案
Feb 01 Javascript
JavaScript解析URL参数示例代码
Aug 12 Javascript
页面加载完毕后滚动条自动滚动一定位置
Feb 20 Javascript
JavaScript不使用prototype和new实现继承机制
Dec 29 Javascript
JavaScript设置获取和设置属性的方法
Mar 04 Javascript
鼠标事件的screenY,pageY,clientY,layerY,offsetY属性详解
Mar 12 Javascript
跟我学习javascript的undefined与null
Nov 17 Javascript
jQuery验证插件validate使用方法详解
Sep 13 Javascript
自定义事件解决重复请求BUG的问题
Jul 11 Javascript
js自定义弹框插件的封装
Aug 24 Javascript
Vue封装一个简单轻量的上传文件组件的示例
Mar 21 Javascript
使用 Node.js 实现图片的动态裁切及算法实例代码详解
Sep 29 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
动态网站web开发 PHP、ASP还是ASP.NET
2006/10/09 PHP
如何实现给定日期的若干天以后的日期
2006/10/09 PHP
特详细的PHPMYADMIN简明安装教程
2008/08/01 PHP
PHP采集腾讯微博的实现代码
2012/01/19 PHP
对PHP依赖注入的理解实例分析
2016/10/09 PHP
PHP错误处理函数register_shutdown_function使用示例
2017/07/03 PHP
php实现表单提交上传文件功能
2018/05/28 PHP
PHP序列化和反序列化深度剖析实例讲解
2020/12/29 PHP
JS 用6N±1法求素数 实例教程
2009/10/20 Javascript
基于jquery实现的鼠标滑过按钮改变背景图片
2011/07/15 Javascript
基于pthread_create,readlink,getpid等函数的学习与总结
2013/07/17 Javascript
JavaScript实现in-place思想的快速排序方法
2016/08/07 Javascript
jQuery分页插件jquery.pagination.js使用方法解析
2017/02/09 Javascript
微信小程序实现下拉刷新和轮播图效果
2017/11/21 Javascript
React父子组件间的传值的方法
2018/11/13 Javascript
用Vue编写抽象组件的方法
2019/05/06 Javascript
微信小程序自定义头部导航栏和导航栏背景图片 navigationStyle问题
2019/07/26 Javascript
记录微信小程序 height: calc(xx - xx);无效问题
2019/12/30 Javascript
[44:40]Spirit vs Navi Supermajor小组赛 A组败者组第一轮 BO3 第一场 6.2
2018/06/03 DOTA
[01:14]2019完美世界城市挑战赛(秋季赛)全国总决赛精彩花絮
2020/01/08 DOTA
[29:16]完美世界DOTA2联赛决赛日 Inki vs LBZS 第三场 11.08
2020/11/10 DOTA
Python抓取框架Scrapy爬虫入门:页面提取
2017/12/01 Python
django1.11.1 models 数据库同步方法
2018/05/30 Python
python实现彩色图转换成灰度图
2019/01/15 Python
Python数据类型之Dict字典实例详解
2019/05/07 Python
Python数据类型之Tuple元组实例详解
2019/05/08 Python
python使用百度文字识别功能方法详解
2019/07/23 Python
Django Admin后台模型列表页面如何添加自定义操作按钮
2020/11/11 Python
求职简历中的自我评价分享
2013/12/08 职场文书
4s店机修工岗位职责
2013/12/20 职场文书
临床护士自荐信
2014/01/31 职场文书
更夫岗位责任制
2014/02/11 职场文书
销售主管竞聘书
2014/03/31 职场文书
产假请假条
2014/04/10 职场文书
国际商贸专业自荐信
2014/06/09 职场文书
Python基础之函数嵌套知识总结
2021/05/23 Python