jQuery综述
jQuery是一个轻量级JavaScript库
它可以进行如下操作：
- 选取HTML元素
- 对HTML元素进行操作
- 对CSS进行操作
- 编写HTML事件函数
- JavaScript特效
- HTML DOM
- AJAX
- 添加jQuery库的方式很简单,在head中添加包含了所有jQuery函数的js文件即可。该文件需要从jQuery.com下载。
<head>
<script type="text/javascript" src="jquery.js"></script>
</head>
或者使用CDN
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs
/jquery/1.8.0/jquery.min.js"></script>
</head>
HTML5中可以省略type="text/javascript"
建议使用CDN的方式，页面加载速度会比较快
- jQurey语法
$(selector).action()
selector用来查找HTML元素
action用来执行对元素的操作
e.g
<html>
<head>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.0.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("p").hide();
});
});
</script>
</head> <body>
<h2>hi</h2>
<p>hello</p>
<button type="button">Click me</button>
</body>
</html>
点击后，
为了保证在文档加载完全之后运行jQuery部分的代码
需要将jQuery函数置于$(document).ready(function(){
});中
- jQuery选择元素
$("p") --选取<p>元素
$("#demo") --选取id为demo的元素
$(".demo") --选取class为demo的元素
这几种方式可以组合使用
e.g $("div#demo.head") -- id=demo的元素中class=head的元素
- jQuery选择属性
$("[href]") --带href属性的元素
$("[href='x']") --选取所有带有 href 值等于 "x" 的元素。
$("[href!='x']") -- 选取所有带有 href 值不等于 "x" 的元素。
$("[href$='.png']") -- 选取所有 href 值以 ".png" 结尾的元素。
- CSS选择
$("p").css("font-size");
jQuery综述的更多相关文章
- XXX系统发展综述（SSH+Jquery EasyUI）
一个.该项目总体介绍 前一段时间的工作.我大概花了两三个月开发Web管理信息系统.用于框架集Struts2.3.1+Spring3.0+Hibernate3+Jquery EasyUI1.3.5.业务 ...
- jQuery 邮箱下拉列表自动补全
综述 我想大家一定见到过,在某个网站填写邮箱的时候,还没有填写完,就会出现一系列下拉列表,帮你自动补全邮箱的功能.现在我们就用jQuery来实现一下. 博主原创代码,如有代码写的不完善的地方还望大家多 ...
- 最新的jQuery插件和JavaScript库
每一个前端开发人员很清楚的重要性和功能的JavaScript库提供.它提供了一个简单的接口,用于构建快速动态的接口,而无需大量的代码. 谢谢你的超级从事jQuery开发者社区,人始终是创造新的和令人惊 ...
- 全屏背景：15个jQuery插件实现全屏背景图像或媒体
动态网站通常利用背景图像或预加载屏幕,以保证所有资源都加载到页面上,在浏览器中充分呈现.现在很多网站都炫耀自己的图像作为背景图像全屏背景,追溯到旧的Flash网站却用自己的方式在HTML资源重布局. ...
- 经典收藏 50个jQuery Mobile开发技巧集萃
http://www.cnblogs.com/chu888chu888/archive/2011/11/10/2244181.html 1.Backbone移动实例 这是在Safari中运行的一款Ba ...
- (转)经典收藏 50个jQuery Mobile开发技巧集萃
(原)http://www.cnblogs.com/chu888chu888/archive/2011/11/10/2244181.html 经典收藏 50个jQuery Mobile开发技巧集萃 ...
- jQuery应用一之验证插件validate的使用
综述 validate是一个用来验证表单提交的插件,应用十分广泛,具有如下的几个功能 自带了基本的验证规则 提供了丰富的验证信息提示功能 多种事件触发验证 自定义验证规则 下面我们就来感受一下这个插件 ...
- 使用jquery.uploadify动态传递自己的参数
上传碰到这个问题在上传文件的时候同时上传文件的类型..上网找了半天.总于解决了..分享一下了..直接例子了.. html <%@ page language="java" i ...
- Angular杂谈系列1-如何在Angular2中使用jQuery及其插件
jQuery,让我们对dom的操作更加便捷.由于其易用性和可扩展性,jQuer也迅速风靡全球,各种插件也是目不暇接. 我相信很多人并不能直接远离jQuery去做前端,因为它太好用了,我们以前做的东西大 ...
随机推荐
- 阿里云服务器 ECS 部署lamp：centos+apache+mysql+php安装配置方法 （centos7）
阿里云服务器 ECS 部署lamp:centos+apache+mysql+php安装配置方法 (centos7) 1.效果图 1 2. 部署步骤 1 1. mysql安装附加(centos7) 7 ...
- 【bzoj4939】【YNOI2016】掉进兔子洞（莫队）
题目描述 您正在打galgame,然后突然发现您今天太颓了,于是想写个数据结构题练练手: 一个长为 n 的序列 a. 有 m 个询问,每次询问三个区间,把三个区间中同时出现的数一个一个删掉,问最后三个 ...
- web安全-点击劫持
web安全-点击劫持 opacity=0 iframe是目标网站 被内嵌了 1.用户亲手操作 盗取用户 视频 2.用户不知情 >* 引导点击 其实点击的是覆盖在下面opacity=0的ifram ...
- CompressFormat压缩性能
在产品应用场景内有个需求,Bitmap原图压缩保存.但是每次保存一个图片,需要500+ms.原本以为是sd卡写的慢.后来测试发现是图片压缩问题.试验过CompressFormat PNG和JPEG两种 ...
- P3628 [APIO2010]特别行动队
\(\color{#0066ff}{ 题目描述 }\) 你有一支由 \(n\) 名预备役士兵组成的部队,士兵从 \(1\) 到 \(n\) 编号,要将他们拆分 成若干特别行动队调入战场.出于默契的考虑 ...
- 使用js实现水波效果
使用到的工具:jQuery Ripples Plugin 下载安装 git clone https://github.com/sirxemic/jquery.ripples.git 引入jquery, ...
- 文件上传之伪Ajax篇
iframe上传文件 接上篇:Ajax的最大特点就是无刷新(实际上是跳转),因此楼主想通过模拟Ajax的方式进行文件上传,也就是iframe上传文件 话不多说,直接上代码 HTML: <ifra ...
- Qt 学习之路 2（25）：画刷和画笔
Home / Qt 学习之路 2 / Qt 学习之路 2(25):画刷和画笔 Qt 学习之路 2(25):画刷和画笔 豆子 2012年11月5日 Qt 学习之路 2 17条评论 前面一章我们提 ...
- Javaweb 实现分页功能
package cn.zr.testpage.entity; public class User { private String name; private int age; private Str ...
- P2596 [ZJOI2006]书架（splay）
[题目链接] https://www.luogu.org/problemnew/show/P2596 平衡树,需支持五个操作: 1. 将某元素置顶:将元素旋到根,然后将左子树合并到该元素的后继 2. ...