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实现GridView单选效果自动设置交替行、选中行、鼠标移动行背景色
May 27 Javascript
jquery live()重复绑定的解决方法介绍
Jan 03 Javascript
HTML5使用DeviceOrientation实现摇一摇功能
Jun 05 Javascript
javascript实现倒计时跳转页面
Jan 17 Javascript
Webwork 实现文件上传下载代码详解
Feb 02 Javascript
AngularJS下对数组的对比分析
Aug 24 Javascript
Node.js中如何合并两个复杂对象详解
Dec 31 Javascript
完美解决input[type=number]无法显示非数字字符的问题
Feb 28 Javascript
浅谈在Vue-cli里基于axios封装复用请求
Nov 06 Javascript
微信小程序自定义轮播图
Nov 04 Javascript
微信小程序第三方框架对比 之 wepy / mpvue / taro
Apr 10 Javascript
解决vue使用vant轮播组件swipe + flex时文字抖动问题
Jan 07 Vue.js
用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教程 预定义变量
2009/10/23 PHP
php 无限级分类学习参考之对ecshop无限级分类的解析 带详细注释
2010/03/23 PHP
PHP基于php_imagick_st-Q8.dll实现JPG合成GIF图片的方法
2014/07/11 PHP
PHP通过引用传递参数用法分析
2016/12/01 PHP
php cli模式下获取参数的方法
2017/05/05 PHP
PHP 中使用explode()函数切割字符串为数组的示例
2017/05/06 PHP
Laravel中使用Queue的最基本操作教程
2017/12/27 PHP
Laravel框架定时任务2种实现方式示例
2018/12/08 PHP
php如何利用pecl安装mongodb扩展详解
2019/01/09 PHP
javascript 出生日期和身份证判断大全
2008/11/13 Javascript
dwr spring的集成实现代码
2009/03/22 Javascript
js 无提示关闭浏览器页面的代码
2010/03/09 Javascript
js用正则表达式来验证表单(比较齐全的资源)
2013/11/17 Javascript
javascript模拟枚举的简单实例
2014/03/06 Javascript
jQuery弹出遮罩层效果完整示例
2016/09/13 Javascript
JavaScript编写九九乘法表(两种任选)
2017/02/04 Javascript
jQuery实现Table表格隔行变色及高亮显示当前选择行效果示例
2017/02/14 Javascript
jQuery查找dom的几种方法效率详解
2017/05/17 jQuery
深入浅析Vue不同场景下组件间的数据交流
2017/08/15 Javascript
jQuery实现打开网页自动弹出遮罩层或点击弹出遮罩层功能示例
2017/10/19 jQuery
JavaScript中利用Array filter() 方法压缩稀疏数组
2018/02/24 Javascript
Vue自定义指令实现checkbox全选功能的方法
2018/02/28 Javascript
vue中实现Monaco Editor自定义提示功能
2019/07/05 Javascript
详细分析Node.js 多进程
2020/06/22 Javascript
解决Nuxt使用axios跨域问题
2020/07/06 Javascript
python调用短信猫控件实现发短信功能实例
2014/07/04 Python
python爬虫之xpath的基本使用详解
2018/04/18 Python
Python爬虫学习之获取指定网页源码
2019/07/30 Python
keras获得model中某一层的某一个Tensor的输出维度教程
2020/01/24 Python
python 利用toapi库自动生成api
2020/10/19 Python
html5 更新图片颜色示例代码
2014/07/29 HTML / CSS
BannerBuzz加拿大:在线定制横幅印刷、广告和标志
2020/03/10 全球购物
北京一家公司的.net开发工程师笔试题
2012/04/17 面试题
产品销售员岗位职责
2013/12/18 职场文书
八一建军节感言
2014/02/28 职场文书