jQuery 库 - 特性：

　　　　jQuery 是一个 JavaScript 函数库。

　　　　jQuery 库包含以下特性：

　　　　　　　html 元素获取，

　　　　　　　html 元素操作，

　　　　　　　css 操作，

　　　　　　　html 事件函数，

　　　　　　　JavaScript 特效和动画，

　　　　　　　html DOM 遍历和修改，

　　　　　　　ajax，

　　　　　　　Utilities　

给自己的页面添加 jQuery 库

　　　　如需使用 jQuery，您需要下载 jQuery 库，然后把它包含在希望使用的网页中。

　　　　jQuery 库是一个 JavaScript 文件（其中包含了所有的 jQuery 函数），您可以使用 HTML 的 <script> 标签引用它：

<head>

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

</head>

　　　　请注意，<script> 标签应该位于页面的 <head> 部分。（<script> 标签中的 type="text/javascript" 可以不用写，因为 JavaScript 是 HTML5 以及所有现代浏览器中的默认脚本语言）

　　　　库的替代：

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

<head>

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

</head>

jQuery 语法：

　　　　jQuery 语法是为 HTML 元素的选取编制的，可以对元素执行某些操作，因此 jQuery 的基本语法是：$(selector).action()

　　　　说明如下：

　　　　　　　　1、美元符号定义 jQuery

　　　　　　　　2、选择符（selector）“查询”和“查找” html 元素

　　　　　　　　3、jQuery 的 action() 执行对元素的操作

jQuery 选择器：

　　　　选择器允许您对单个元素或元素组进行操作。

　　　　jQuery 元素选择器和属性选择器允许您通过标签名、属性名或内容对 html 元素进行选择。

　　jQuery 元素选择器：

　　　　　　jQuery 使用 CSS 选择器来选取 HTML 元素。

　　　　　　$("p") 选取 <p> 元素。

　　　　　　$("p .intro") 选取所有 class="intro" 的 <p> 元素。

　　　　　　$("p #demo") 选取所有 id="demo" 的 <p> 元素。

　　jQuery 属性选择器：

　　　　　　jQuery 使用 XPath 表达式来选择带有给定属性的元素。

　　　　　　$("[href]") 选取所有带有 href 属性的元素。

　　　　　　$("[href='#']") 选取所有带有 href 值等于 "#" 的元素。

　　　　　　$("[href!='#']") 选取所有带有 href 值不等于 "#" 的元素。

　　　　　　$("[href$='.jpg']") 选取所有 href 值以 ".jpg" 结尾的元素。

　　jQuery CSS 选择器：

　　　　　　jQuery CSS 选择器可用于改变 HTML 元素的 CSS 属性。

　　　　　　实例：  $("p").css("background-color","red");　　　　//该实例可以把所有 p元素的背景颜色更改为红色

　　更多的选择器实例：

　　　　　　$(this)　　　　　　//当前 html 元素

　　　　　　$(".intro")　　　　　//所有 class=“intro” 的元素

　　　　　　$("#intro")　　　　// id="intro" 的元素

　　　　　　$("ul li:first")　　　　//每个<ul>的第一个<li>

　　　　　　$("[ href $= '.jpg' ]")　　//所有带有以 “.jpg” 结尾的属性值的 href 属性

　　　　　　$("div #intro .head")　　// id="intro" 的<div>元素中的所有 class=“head” 的元素

jQuery 事件：

　　　　jQuery 是为事件处理特别设计的。（所以应该把所有 jQuery 代码置于事件处理函数中）

　　　　jQuery 事件处理方法是 jQuery 中的核心函数。（事件处理方法指的是当 HTML 中发生某些事件时所调用的方法。）

　　　　通常会把 jQuery 代码放到 <head>部分的事件处理方法中。

　　　　实例：  $("button").click(function() { ..some code... })　　　　//在该实例中，当按钮的点击事件被触发时会调用一个函数。

　　单独文件中的函数：

　　　　　　如果您的网站包含许多页面，并且您希望您的 jQuery 函数易于维护，那么请把您的 jQuery 函数放到独立的 .js 文件中。（具体怎么写？）

　　　　　　当我们在教程中演示 jQuery 时，会将函数直接添加到 <head> 部分中。不过，把它们放到一个单独的文件中会更好。（通过 src 属性来引用文件）

　　　　　　实例：

<head>

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

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

</head>

　　jQuery 名称冲突：

　　　　jQuery 使用 $ 符号作为 jQuery 的简介方式，但某些其他 JavaScript 库中的函数（比如 Prototype）同样使用 $ 符号。

　　　　jQuery 使用名为 noConflict() 的方法来解决该问题 —— var jq=jQuery.noConflict()，帮助您使用自己的名称（比如 jq）来代替 $ 符号。

　　下面是 jQuery 中事件方法的一些例子：

　　　　　　$(document).ready(function)　　　　//当文档加载完成时

　　　　　　$(selector).click(function)　　　　//被选择的元素的单击事件

　　　　　　$(selector).dblclick(function)　　　　//双击

　　　　　　$(selector).focus(function)　　　　//获得焦点

　　　　　　$(selector).mouseover(function)　　//鼠标悬停

jquery 学习（一）：jQuery 简介的更多相关文章

  1. jquery学习笔记---jquery插件开发

    http://www.cnblogs.com/Wayou/p/jquery_plugin_tutorial.html jquery插件开发:http://www.cnblogs.com/damonla ...

  2. (高级篇)jQuery学习之jQuery Ajax用法详解

    jQuery Ajax在web应用开发中很常用,它主要包括有ajax,get,post,load,getscript等等这几种常用无刷新操作方法,下面我来给各位同学介绍介绍. 我们先从最简单的方法看起 ...

  3. JQuery学习笔记---jquery对象和DOM对象的关系

    1.DOM(Document  Object Model,文档对象模型).DOM树 { html (head&&body),  head(meta && title) ...

  4. jQuery学习之jQuery Ajax用法详解

    jQuery Ajax在web应用开发中很常用,它主要包括有ajax,get,post,load,getscript等等这几种常用无刷新操作方法,下面我来给各位同学介绍介绍. 我们先从最简单的方法看起 ...

  5. jquery学习笔记----jquery相关的文档

    http://tool.oschina.net/apidocs/apidoc?api=jquery http://www.w3school.com.cn/jquery/jquery_ref_event ...

  6. jQuery学习之jQuery Ajax用法详解（转）

    [导读] jQuery Ajax在web应用开发中很常用,它主要包括有ajax,get,post,load,getscript等等这几种常用无刷新操作方法,下面我来给各位同学介绍介绍.我们先从最简单的 ...

  7. jQuery学习之jQuery Ajax用法详解(转)

    jQuery Ajax在web应用开发中很常用,它主要包括有ajax,get,post,load,getscript等等这几种常用无刷新操作方法,下面我来给各位同学介绍介绍. 我们先从最简单的方法看起 ...

  8. jQuery学习笔记（简介，选择器）

    jQuery优势 1. 强大的选择器.jQuery允许开发者使用从CSS1到CSS3几乎所有的选择器,以及jQuery独创的高级而复杂的选择器. 2. 出色的DOM操作封装 3. 可靠的事件处理机制 ...

  9. 【转载】【JQuery学习】jQuery插件开发

    JQuery做得最好的就是他的闭包和扩展性.超级简单的扩展方法,让更多的人可以轻松的开发定制自己的jQuery插件.下面的东西是转载过来当做学习材料的.虽然貌似有点古老,但是jQuery的变更一直都不 ...

  10. jQuery学习(一)——jQuery入门

    1.jQuery基础 Jquery它是一个库(框架),要想使用它,必须先引入! jquery-1.8.3.js:一般用于学习阶段. jquery-1.8.3.min.js:用于项目使用阶段 官网下载后 ...

随机推荐

  1. Visual studio 离线安装

    VS2017在下载好安装程序安装的时候,会根据你选择的功能模块来下载所需要的安装程序,而这些安装程序的下载位置并不会让你选择,而是直接放在 C:\ProgramData\Microsoft\Visua ...

  2. Kylin工作原理、体系架构

    核心思想:预计算. 对多维分析可能用到的度量进行预计算,将计算好的结果保存成Cube,并存在HBase中,供查询时直接访问 将高复杂度的聚合运算.多表连接……操作转换成对预计算结果的查询.决定了Kyl ...

  3. 程序修改图标后显示未更新——强制刷新windows图标缓存

    http://blog.csdn.net/vvlowkey/article/details/51133486 20160412 问题:修改兴迪局放测量软件图标后,release文件夹中生成文件的小图标 ...

  4. Markdown 指南

    Markdown 是一种轻量级的「标记语言」,使用用特殊的 Markdown 文档处理器将 Markdown 语法翻译成预设的文档格式.标题大小等,一般用于展示时输出的是 HTML.这个教程可以让使用 ...

  5. 原生js总结

    数据类型 基本类型值包括: undefined,null,Boolean,Number和String,这些类型分别在内存中占有固定的大小空间,它们的值保存在栈空间,我们通过按值来访问的. 引用类型包括 ...

  6. el-cascader 级联选择器使用时遇到的一些问题

    Element UI Cascader官网文档 <el-form-item label="章节" style="margin-right: 64px"&g ...

  7. 【BZOJ】1875: [SDOI2009]HH去散步

    题目链接:http://www.lydsy.com/JudgeOnline/problem.php?id=1875 注意的是路径不可以重复,所以这题把边看成点.每一条无向边拆成两条有向边. 令${F[ ...

  8. JaveWeb 公司项目（1）----- 使Div覆盖另一个Div完成切换效果

    最近在做网页,用的是CSS+DIV的布局方法,搭建了一个简易的界面,大体上分为三个部分,如图所示: 左侧的为主功能导航栏,右侧是具体的功能实现,下方是固定的版权声明,单击左边不同的导航按钮,在div中 ...

  9. JS实现 进度条 不用控件

    demo1 <html> <head> <title>进度条</title> <style type="text/css"&g ...

  10. python 拷贝文件

    使用绝对目录: import os import shutil shutil.copyfile("/opt/test/update.tar.gz","/opt/updat ...