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 相关文章推荐
JavaScript 自动分号插入(JavaScript synat:auto semicolon insertion)
Nov 04 Javascript
Function.prototype.call.apply结合用法分析示例
Jul 03 Javascript
JavaScript使用ActiveXObject访问Access和SQL Server数据库
Apr 02 Javascript
jQuery检测返回值的数据类型
Jul 13 Javascript
js实时获取并显示当前时间的方法
Jul 31 Javascript
JavaScript中的Number数字类型学习笔记
May 26 Javascript
微信小程序 网络请求(post请求,get请求)
Jan 17 Javascript
bootstarp modal框居中显示的实现代码
Feb 18 Javascript
vue2.0中vue-cli实现全选、单选计算总价格的实例代码
Jul 18 Javascript
基于vue开发微信小程序mpvue-docs跳转页面功能
Apr 10 Javascript
详解Vue串联过滤器的使用场景
Apr 30 Javascript
jQuery实现回到顶部效果
Oct 19 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
PHP+AJAX实现无刷新注册(带用户名实时检测)
2007/01/02 PHP
php文件上传的简单实例
2013/10/19 PHP
jQuery的.live()和.die() 使用介绍
2011/09/10 Javascript
angularjs中的e2e测试实例
2014/12/06 Javascript
jQuery中andSelf()方法用法实例
2015/01/08 Javascript
Webpack 实现 Node.js 代码热替换
2015/10/22 Javascript
学习JavaScript设计模式(链式调用)
2015/11/26 Javascript
学习JavaScript设计模式之模板方法模式
2016/01/20 Javascript
微信小程序 数据访问实例详解
2016/10/08 Javascript
基于JavaScript中标识符的命名规则介绍
2018/01/06 Javascript
React-router4路由监听的实现
2018/08/07 Javascript
angular2/ionic2 实现搜索结果中的搜索关键字高亮的示例
2018/08/17 Javascript
解决vue 引入子组件报错的问题
2018/09/06 Javascript
react高阶组件添加和删除props
2019/04/26 Javascript
vue使用i18n实现国际化的方法详解
2019/09/05 Javascript
jquery轻量级数字动画插件countUp.js使用详解
2019/10/17 jQuery
JS实现无限轮播无倒退效果
2020/09/21 Javascript
Python实现全局变量的两个解决方法
2014/07/03 Python
python编写网页爬虫脚本并实现APScheduler调度
2014/07/28 Python
在Python的web框架中编写创建日志的程序的教程
2015/04/30 Python
使用python爬取微博数据打造一颗“心”
2019/06/28 Python
Python完全识别验证码自动登录实例详解
2019/11/24 Python
Anaconda+spyder+pycharm的pytorch配置详解(GPU)
2020/10/18 Python
通过HTML5 Canvas API绘制弧线和圆形的教程
2016/03/14 HTML / CSS
.TTL是什么?有什么用处,通常那些工具会用到它?(ping? traceroute? ifconfig? netstat?)
2016/05/09 面试题
运动会800米加油稿
2014/02/22 职场文书
《月光启蒙》教学反思
2014/03/01 职场文书
2014年父亲节活动方案
2014/03/06 职场文书
贫困生助学金感谢信
2015/01/21 职场文书
公司庆典欢迎词
2015/01/26 职场文书
大足石刻导游词
2015/02/02 职场文书
外贸采购员岗位职责
2015/04/03 职场文书
Python中如何处理常见报错
2022/01/18 Python
MySQL学习之基础命令实操总结
2022/03/19 MySQL
《王国之心》迎来了发售的20周年, 野村哲发布贺图
2022/04/11 其他游戏
Nginx如何获取自定义请求header头和URL参数详解
2022/07/23 Servers