初步认识JavaScript函数库jQuery


Posted in Javascript onJune 18, 2015

jQuery 库可以通过一行简单的标记被添加到网页中。
jQuery 库 - 特性

jQuery 是一个 JavaScript 函数库。

jQuery 库包含以下特性:

  •     HTML 元素选取
  •     HTML 元素操作
  •     CSS 操作
  •     HTML 事件函数
  •     JavaScript 特效和动画
  •     HTML DOM 遍历和修改
  •     AJAX
  •     Utilities

向您的页面添加 jQuery 库

jQuery 库位于一个 JavaScript 文件中,其中包含了所有的 jQuery 函数。

可以通过下面的标记把 jQuery 添加到网页中:

<head>
<script type="text/javascript" src="jquery.js"></script>
</head>

请注意,<script> 标签应该位于页面的 <head> 部分。
基础 jQuery 实例

下面的例子演示了 jQuery 的 hide() 函数,隐藏了 HTML 文档中所有的 <p> 元素。
实例

<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("p").hide();
});
});
</script>
</head>

<body>
<h2>This is a heading</h2>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
<button type="button">Click me</button>
</body>
</html>

亲自试一试
下载 jQuery

共有两个版本的 jQuery 可供下载:一份是精简过的,另一份是未压缩的(供调试或阅读)。

这两个版本都可从 jQuery.com 下载。
库的替代

Google 和 Microsoft 对 jQuery 的支持都很好。

如果您不愿意在自己的计算机上存放 jQuery 库,那么可以从 Google 或 Microsoft 加载 CDN jQuery 核心文件。
使用 Google 的 CDN

<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs
/jquery/1.4.0/jquery.min.js"></script>
</head>

使用 Microsoft 的 CDN

<head>
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery
/jquery-1.4.min.js"></script>
</head>

Javascript 相关文章推荐
datePicker——日期选择控件(with jquery)
Feb 20 Javascript
js兼容标准的表格变色效果
Jun 28 Javascript
Javascript对象中关于setTimeout和setInterval的this介绍
Jul 21 Javascript
Ext中下拉列表ComboBox组件store数据格式用法介绍
Jul 15 Javascript
用JavaScript和jQuery实现瀑布流
Mar 19 Javascript
BootStrap selectpicker后台动态绑定数据
Jun 01 Javascript
AngularJS学习笔记之表单验证功能实例详解
Jul 06 Javascript
AngularJS 打开新的标签页实现代码
Sep 07 Javascript
微信小程序仿微信运动步数排行(交互)
Jul 13 Javascript
解决vue keep-alive 数据更新的问题
Sep 21 Javascript
vue+element实现表格新增、编辑、删除功能
May 28 Javascript
基于JS实现操作成功之后自动跳转页面
Sep 25 Javascript
用JavaScript显示浏览器客户端信息的超相近教程
Jun 18 #Javascript
浅谈Jquery核心函数
Jun 18 #Javascript
$.extend 的一个小问题
Jun 18 #Javascript
纯js实现无限空间大小的本地存储
Jun 18 #Javascript
JS实现当前页居中分页效果的方法
Jun 18 #Javascript
javascript中Date()函数在各浏览器中的显示效果
Jun 18 #Javascript
javaScript中Math()函数注意事项
Jun 18 #Javascript
You might like
php生成扇形比例图实例
2013/11/06 PHP
解决微信授权回调页面域名只能设置一个的问题
2016/12/11 PHP
ThinkPHP防止重复提交表单的方法实例分析
2018/05/10 PHP
Laravel 5+ .env环境配置文件详解
2020/04/06 PHP
window.onload 加载完毕的问题及解决方案(上)
2009/07/09 Javascript
JSuggest自动匹配下拉框使用方法(示例代码)
2013/12/27 Javascript
jQuery中andSelf()方法用法实例
2015/01/08 Javascript
浅谈javascript中call()、apply()、bind()的用法
2015/04/20 Javascript
JavaScript中数组slice和splice的对比小结
2016/09/22 Javascript
解决vue中无法动态修改jqgrid组件 url地址的问题
2018/03/01 Javascript
微信小程序分享功能之按钮button 边框隐藏和点击隐藏
2018/06/14 Javascript
JavaScript引用类型Object常见用法实例分析
2018/08/08 Javascript
NestJs 静态目录配置详解
2019/03/12 Javascript
Python splitlines使用技巧
2008/09/06 Python
基于Python闭包及其作用域详解
2017/08/28 Python
Python基于贪心算法解决背包问题示例
2017/11/27 Python
python中将\\uxxxx转换为Unicode字符串的方法
2018/09/06 Python
Python分布式进程中你会遇到的问题解析
2019/05/28 Python
python multiprocessing模块用法及原理介绍
2019/08/20 Python
tensorflow 获取checkpoint中的变量列表实例
2020/02/11 Python
Python统计文本词汇出现次数的实例代码
2020/02/27 Python
pyqt5 textEdit、lineEdit操作的示例代码
2020/08/12 Python
欧铁通票官方在线销售网站:Eurail.com
2017/10/14 全球购物
PHP面试题大全
2015/10/16 面试题
个人三严三实对照检查材料思想汇报
2014/09/22 职场文书
机关干部作风建设剖析材料
2014/10/23 职场文书
经典导游欢迎词
2015/01/26 职场文书
饭店服务员岗位职责
2015/02/09 职场文书
公司催款律师函
2015/05/27 职场文书
爸爸的三轮车观后感
2015/06/16 职场文书
毛主席纪念堂观后感
2015/06/17 职场文书
办公室主任岗位竞聘书
2015/09/15 职场文书
小学六一儿童节活动开幕词
2016/03/04 职场文书
七年级作文之关于奶奶
2019/10/29 职场文书
使用numpy nonzero 找出非0元素
2021/05/14 Python
DE1107机评
2022/04/05 无线电