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综述的更多相关文章

  1. XXX系统发展综述(SSH+Jquery EasyUI)

    一个.该项目总体介绍 前一段时间的工作.我大概花了两三个月开发Web管理信息系统.用于框架集Struts2.3.1+Spring3.0+Hibernate3+Jquery EasyUI1.3.5.业务 ...

  2. jQuery 邮箱下拉列表自动补全

    综述 我想大家一定见到过,在某个网站填写邮箱的时候,还没有填写完,就会出现一系列下拉列表,帮你自动补全邮箱的功能.现在我们就用jQuery来实现一下. 博主原创代码,如有代码写的不完善的地方还望大家多 ...

  3. 最新的jQuery插件和JavaScript库

    每一个前端开发人员很清楚的重要性和功能的JavaScript库提供.它提供了一个简单的接口,用于构建快速动态的接口,而无需大量的代码. 谢谢你的超级从事jQuery开发者社区,人始终是创造新的和令人惊 ...

  4. 全屏背景:15个jQuery插件实现全屏背景图像或媒体

    动态网站通常利用背景图像或预加载屏幕,以保证所有资源都加载到页面上,在浏览器中充分呈现.现在很多网站都炫耀自己的图像作为背景图像全屏背景,追溯到旧的Flash网站却用自己的方式在HTML资源重布局. ...

  5. 经典收藏 50个jQuery Mobile开发技巧集萃

    http://www.cnblogs.com/chu888chu888/archive/2011/11/10/2244181.html 1.Backbone移动实例 这是在Safari中运行的一款Ba ...

  6. (转)经典收藏 50个jQuery Mobile开发技巧集萃

    (原)http://www.cnblogs.com/chu888chu888/archive/2011/11/10/2244181.html 经典收藏 50个jQuery Mobile开发技巧集萃   ...

  7. jQuery应用一之验证插件validate的使用

    综述 validate是一个用来验证表单提交的插件,应用十分广泛,具有如下的几个功能 自带了基本的验证规则 提供了丰富的验证信息提示功能 多种事件触发验证 自定义验证规则 下面我们就来感受一下这个插件 ...

  8. 使用jquery.uploadify动态传递自己的参数

    上传碰到这个问题在上传文件的时候同时上传文件的类型..上网找了半天.总于解决了..分享一下了..直接例子了.. html <%@ page language="java" i ...

  9. Angular杂谈系列1-如何在Angular2中使用jQuery及其插件

    jQuery,让我们对dom的操作更加便捷.由于其易用性和可扩展性,jQuer也迅速风靡全球,各种插件也是目不暇接. 我相信很多人并不能直接远离jQuery去做前端,因为它太好用了,我们以前做的东西大 ...

随机推荐

  1. [poj 2106] Boolean Expressions 递归

    Description The objective of the program you are going to produce is to evaluate boolean expressions ...

  2. [poj 1185] 炮兵阵地 状压dp 位运算

    Description 司令部的将军们打算在N*M的网格地图上部署他们的炮兵部队.一个N*M的地图由N行M列组成,地图的每一格可能是山地(用"H" 表示),也可能是平原(用&quo ...

  3. django 学习之DRF (二)

    Django学习之DRF02 Serializer序列化器之反序列化操作    1.调⽤序列化器进⾏验证        0.准备序列化器 class BookInfoSerializer(serial ...

  4. 解读人:陈秋实,SP2: Rapid and Automatable Contaminant Removal from Peptide Samples for Proteomic Analyses(标准操作流程2:如何在蛋白质组学分析中快速和自动的去除肽段样品中的污染物)

    发表时间:2019年4月 IF:3.950 单位: 威斯康星医学院生物化学系 威斯康星医学院生物医学质谱研究中心 物种:人(人体肾脏细胞和蛋白) 技术:肽段清理 一. 概述:(用精炼的语言描述文章的整 ...

  5. 1、OpenCV Python 图像加载和保存

    __author__ = "WSX" import cv2 as cv # 这里的文件是图片或者视频 def Save_File( image ): cv.imwrite(&quo ...

  6. (Python OpenGL)【 0】关于VAO和VBO以及OpenGL新特性

    (Python OpenGL)关于新版OpenGL需要了解的: 随着OpenGL状态和固定管线模式的移除,我们不在用任何glEnable函数调用,而且也不会有glVertex.glColor等函数调用 ...

  7. JavaScript new Date()IE浏览器下出错 NaN

    当涉及到编程,与日期的工作可能是棘手的.然而,幸运的是,大多数语言都已经完成了这个困难的工作,并有一种内置的日期功能来帮助我们.JavaScript是具有有用的功能来帮助大量输出,设置日期. The ...

  8. 小程序首页不显示tabBar

    app.json中配置了tabBar,但是首页不想显示,首页跳转时使用 wx.redirectTo和wx.navigateTo无法完成跳转 这时用到了 wx.switchTab 可以实现我们的需求,首 ...

  9. 黑马学习CSS选择器 简单选择器 结合符 选择器组合 选择器优先级

  10. Python迭代器生成器,模块和包

      1.迭代器和生成器 2.模块和包 1.迭代器 迭代器对象要求支持迭代器协议的对象,在Python中,支持迭代器协议就是实现对象的__iter__()和__next__()方法.    其中__it ...