第十五篇：jQuery
本篇内容
- 简介
- 使用
一、 简介
jQuery 是一个 JavaScript 库。
jQuery 极大地简化了 JavaScript 编程。
jQuery 很容易学习。
jQuery 库可以通过一行简单的标记被添加到网页中。
- HTML 元素选取
- HTML 元素操作
- CSS 操作
- HTML 事件函数
- JavaScript 特效和动画
- HTML DOM 遍历和修改
- AJAX
- Utilities
二、 使用
（1）引用jQuery
把 jQuery 添加到您的网页
如需使用 jQuery，您需要下载 jQuery 库（会在下面为您讲解），然后把它包含在希望使用的网页中。
jQuery 库是一个 JavaScript 文件，您可以使用 HTML 的 <script> 标签引用它：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="jquery.js"></script>
</head>
<body> </body>
</html>
（2）元素选择器
jQuery 使用 CSS 选择器来选取 HTML 元素。
$("p") 选取 <p> 元素。
$("p.intro") 选取所有 class="intro" 的 <p> 元素。
$("p#demo") 选取所有 id="demo" 的 <p> 元素。
（3）属性选择器
jQuery 使用 XPath 表达式来选择带有给定属性的元素。
$("[href]") 选取所有带有 href 属性的元素。
$("[href='#']") 选取所有带有 href 值等于 "#" 的元素。
$("[href!='#']") 选取所有带有 href 值不等于 "#" 的元素。
$("[href$='.jpg']") 选取所有 href 值以 ".jpg" 结尾的元素。
（4）CSS 选择器
jQuery CSS 选择器可用于改变 HTML 元素的 CSS 属性。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.0.js"></script>
</head>
<body>
<p>test</p> <script>
$("p").css("background-color","red");
</script>
</body>
</html>
（5）jQuery 事件函数
jQuery 事件处理方法是 jQuery 中的核心函数。
事件处理程序指的是当 HTML 中发生某些事件时所调用的方法。术语由事件“触发”（或“激发”）经常会被使用。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.0.js"></script>
</head>
<body>
<h2>This is a heading</h2>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
<button>Click me</button> <script>
$(document).ready(function(){
$("button").click(function(){
$("p").hide();
});
});
</script>
</body>
</html>
第十五篇：jQuery的更多相关文章
- 第二十五篇 jQuery 学习7 获取并设置 CSS 类
jQuery 学习7 获取并设置 CSS 类 jQuery动态控制页面,那么什么是动态呢?我们就说一下静态,静态几乎又纯html+css完成,就是刷新页面之后,不会再出现什么变动,一个实打实的静态 ...
- 解剖SQLSERVER 第十五篇 SQLSERVER存储过程的源文本存放在哪里？（译）
解剖SQLSERVER 第十五篇 SQLSERVER存储过程的源文本存放在哪里?(译) http://improve.dk/where-does-sql-server-store-the-sourc ...
- Python之路【第十五篇】：Web框架
Python之路[第十五篇]:Web框架 Web框架本质 众所周知,对于所有的Web应用,本质上其实就是一个socket服务端,用户的浏览器其实就是一个socket客户端. 1 2 3 4 5 6 ...
- 第十五篇 Integration Services：SSIS参数
本篇文章是Integration Services系列的第十五篇,详细内容请参考原文. 简介在前一篇,我们使用SSDT-BI将第一个SSIS项目My_First_SSIS_Project升级/转换到S ...
- 【译】第十五篇 Integration Services：SSIS参数
本篇文章是Integration Services系列的第十五篇,详细内容请参考原文. 简介在前一篇,我们使用SSDT-BI将第一个SSIS项目My_First_SSIS_Project升级/转换到S ...
- 跟我学SpringCloud | 第十五篇：微服务利剑之APM平台（一）Skywalking
目录 SpringCloud系列教程 | 第十五篇:微服务利剑之APM平台(一)Skywalking 1. Skywalking概述 2. Skywalking主要功能 3. Skywalking主要 ...
- Egret入门学习日记 --- 第十五篇（书中 6.1~6.9节 内容）
第十五篇(书中 6.1~6.9节 内容) 好的,昨天完成了第五章. 今天来看第六章. 总结重点: 1.如何对组件进行分组? 跟着做: 重点1:如何对组件进行分组? 首先,选中你想要组合的组件. 然后点 ...
- 淘宝(阿里百川)手机客户端开发日记第十五篇 JSON解析(四)
解析一个从淘宝传递的JSON (大家如有兴趣可以测试下):{ "tae_item_detail_get_response": { "data": { " ...
- Android UI开发第三十五篇——AppCompat实现Action Bar
每一位Android开发者对Action Bar这种设计都不陌生了,毕竟它已经发布了至少两年了.Android团队发布Action Bar设计规范时同时放出了ActionBar的Api来支持这种设计. ...
- SpringBoot第十五篇：swagger构建优雅文档
作者:追梦1819 原文:https://www.cnblogs.com/yanfei1819/p/11007470.html 版权声明:本文为博主原创文章,转载请附上博文链接! 引言 前面的十四 ...
随机推荐
- Mantle--国外程序员最常用的iOS模型&字典转换框架
Mantle简介 Mantle是iOS和Mac平台下基于Objective-C编写的一个简单高效的模型层框架. Mantle能做什么 Mantle可以轻松把JSON数据.字典(Dictionary)和 ...
- 2018/7/16 YMOI模拟 NOIP2013D2T3华容道
题目描述 Description 小 B 最近迷上了华容道,可是他总是要花很长的时间才能完成一次.于是,他想到用编程来完成华容道:给定一种局面,华容道是否根本就无法完成,如果能完成,最少需要多少时间. ...
- lintcode_111_爬楼梯
爬楼梯 描述 笔记 数据 评测 假设你正在爬楼梯,需要n步你才能到达顶部.但每次你只能爬一步或者两步,你能有多少种不同的方法爬到楼顶部? 您在真实的面试中是否遇到过这个题? Yes 哪家公司问你的 ...
- spring-JDBC Template
JDBC Template概念 为简化持久化操作,spring在JDBC API之上提供JDBC Template组件 提供统一模板: 环境配置 1.创建MySQL数据库 2.搭建maven项目,并引 ...
- js获取url参数方法
function GetQueryString(name) { var reg = new RegExp("(^|&)" + name + "=([^&] ...
- 右键git-bash不能使用
主要:右键git-bash不能使用 右键git-bash不能使用 今日想用git传写代码到仓库,突然发现几天没有却出问题了,右键出现了错误,虽然很快解决了,但还是可以记录下 情形: 右键存在但不能使用 ...
- Python学习笔记：PEP8常用编程规范
PEP8编码规范是一种非常优秀的编码规范,也得到了Python程序员的普遍认可,如果实践中或者项目中没有统一的编码规范,建议尽量遵循PEP8编码规范,当然如果项目中已经有了自身的编码规范,应当优先遵循 ...
- 机器学习笔记（一）—— 线性回归问题与Matlab求解
给你多组数据集,例如给你很多房子的面积.房子距离市中心的距离.房子的价格,然后再给你一组面积. 距离,让你预测房价.这类问题称为回归问题. 回归问题(Regression) 是给定多个自变量.一个因变 ...
- 关于修改zeppelin的代码显示
最近我在修改zeppelin(0.7版本)的源码相关的知识,目前做的工作是修改zeppelin的代码,为了让zeppelin可以可以在页面中显示数据集,并且在其数据库中存储式真实的路径1.如果我们要运 ...
- JavaScript获取时间
var myDate = new Date(); console.log(myDate.getFullYear()); //获取完整的年份(4位,1970-????) ...