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 26 Javascript
javascript闭包传参和事件的循环绑定示例探讨
Apr 17 Javascript
JavaScript点击按钮后弹出透明浮动层的方法
May 11 Javascript
jQuery使用经验小技巧(推荐)
May 31 Javascript
js 定位到某个锚点的方法
Nov 19 Javascript
node+experss实现爬取电影天堂爬虫
Nov 20 Javascript
JavaScript实现带有子菜单和控件的slider轮播图效果
Nov 01 Javascript
详解如何在vue项目中使用lodop打印插件
Sep 27 Javascript
关于vue的npm run dev和npm run build的区别介绍
Jan 14 Javascript
使用Vue CLI创建typescript项目的方法
Aug 09 Javascript
JS秒杀倒计时功能完整实例【使用jQuery3.1.1】
Sep 03 jQuery
jQuery实现验证用户登录
Dec 10 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实现时间比较和时间差计算的方法示例
2017/07/24 PHP
js获取某月的最后一天日期的简单实例
2013/06/22 Javascript
非常好用的JsonToString 方法 简单实例
2013/07/18 Javascript
jQuery在线选座位插件seat-charts特效代码分享
2015/08/27 Javascript
JS实现的简洁纵向滑动菜单(滑动门)效果
2015/10/19 Javascript
JSON+Jquery省市区三级联动
2016/01/13 Javascript
JavaScript中的this使用详解
2016/07/27 Javascript
jQuery实现页面下拉100像素出现悬浮窗口的方法
2016/09/05 Javascript
BootStrap中
2016/12/10 Javascript
react router4+redux实现路由权限控制的方法
2018/05/03 Javascript
Layui组件Table绑定行点击事件和获取行数据的方法
2018/08/19 Javascript
解决微信小程序防止无法回到主页的问题
2018/09/28 Javascript
Vue使用NPM方式搭建项目
2018/10/25 Javascript
详解JS判断页面是在手机端还是在PC端打开的方法
2019/04/26 Javascript
jquery实现二级导航下拉菜单效果实例
2019/05/14 jQuery
vue实现评论列表功能
2019/10/25 Javascript
django实现分页的方法
2015/05/26 Python
Windows下python2.7.8安装图文教程
2016/05/26 Python
Python爬虫工程师面试问题总结
2018/03/22 Python
Python实现合并同一个文件夹下所有txt文件的方法示例
2018/04/26 Python
自学python的建议和周期预算
2019/01/30 Python
python利用selenium进行浏览器爬虫
2019/04/25 Python
python pytest进阶之xunit fixture详解
2019/06/27 Python
如何在python开发工具PyCharm中搭建QtPy环境(教程详解)
2020/02/04 Python
python两种获取剪贴板内容的方法
2020/11/06 Python
pyqt5实现井字棋的示例代码
2020/12/07 Python
HTML利用九宫格原理进行网页布局
2020/03/13 HTML / CSS
加拿大便宜的隐形眼镜商店:Clearly
2016/09/15 全球购物
佳能德国网上商店:Canon德国
2017/03/18 全球购物
英国最大的运动营养公司之一:LA Muscle
2018/07/02 全球购物
中科前程Java笔试题
2016/11/20 面试题
志愿者服务感言
2014/02/27 职场文书
秋天的图画教学反思
2014/05/01 职场文书
员工廉洁自律承诺书
2014/05/26 职场文书
大学生求职信
2014/06/17 职场文书
详细聊聊浏览器是如何看闭包的
2021/11/11 Javascript