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. PTA 7-2 二叉搜索树的结构(30 分)

    7-2 二叉搜索树的结构(30 分) 二叉搜索树或者是一棵空树,或者是具有下列性质的二叉树: 若它的左子树不空,则左子树上所有结点的值均小于它的根结点的值:若它的右子树不空,则右子树上所有结点的值均大 ...

  2. 中文目录对 sublime text 有什么影响?

    用了这软件好几个月了,一直没出现问题.最近做精简时,发现一个奇怪的问题. 相同的配置,为什么两个程序表现得不一样? 难道是哪里的配置不一样? 难道是插件被我精简得太厉害了? 难道是插件有依赖文件被我删 ...

  3. 微信小程序--bind 和catch区别

    冒泡事件,当点击最里面的事件的时候,外面有事件也会执行,如3>2>1, 点击2时,2>1, 点击 最外层时 1. 1. bind事件  2.catch事件 catch事件是一个单独的 ...

  4. 【四】php 函数

    一:函数 作用:为了分割那些能够独立完成有明确任务的代码,更易于阅读 调用函数:function_name(args1,args2...); args可以是任何一种php变量,包括数组或对象 函数名不 ...

  5. centos nginx 中安装ssl证书 以及在项目中的使用

    今天阿里云的证书到期了,重新申请了一个,下面是从申请到安装以及结合项目使用的过程: 1.登录阿里云   2.在左侧找到SSL证书 3.申请免费的证书 4.下载证书 5.根据说明配置nginx 6.在项 ...

  6. Java技术——你真的了解String类的intern()方法吗

    0.引言 什么都先不说,先看下面这个引入的例子:   String str1 = new String("SEU")+ new String("Calvin") ...

  7. [osg]osg绘制动态改变顶点的几何体

    最简单的顶点数据更新方法是预先获取setVertexArray()所用的数组数据,并对其进行更新.但是对于开启显示列表支持的几何体(这是默认的情况)来说,有一个问题需要特别需要引起注意,即显示列表中的 ...

  8. try catch对Spring事务的影响

    一.Spring 的默认事务机制,当出现unchecked异常时候回滚,checked异常的时候不会回滚. 异常中unchecked异常包括error和runtime异常.需要try catch或向上 ...

  9. nginx 启动报错 1113: No mapping for the Unicode character exists in the target multi-byte code

    failed (1113: No mapping for the Unicode character exists in the target multi-byte code page) 因为路径有中 ...

  10. QT json字符串生成和解析

    1         QT json字符串生成和解析 1.1  QT Json解析流程 (1)  字符串转化为QJsonDocument QJsonParseError json_error; QJso ...