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. Nuget 打包 for .Net Standart project

    Create .NET Standard packages with Visual Studio 2015 Publishing packages nuge.exe 放在项目目录中 nuget spe ...

  2. eclipse安装spring boot插件spring tool suite

    进行spring cloud的学习,要安装spring boot 的spring -tool-suite插件,我在第一次安装时,由于操作不当,两天才完全安装好,真的是要命了,感觉自己蠢死!下面就自己踩 ...

  3. 数据库中清空数据,保留表结构的sql语句

    方法一:Delete Form 表名 方法二:TRUNCATE TABLE 在功能上与不带 WHERE 子句的 DELETE 语句相同:二者均删除表中的全部行.但 TRUNCATE TABLE 比 D ...

  4. latex建立参考文献的超链接

    在Latex生成的pdf文档中建立超链接(如从正文到参考文献,从目录到相应内容,从页码编号到实际页面等),有利于读者快速定位当前阅读的信息. 如何在生成的pdf文件中包含超链接呢?需要注意一下两点: ...

  5. github删除某个库repository

    1.登陆gihub网站,在该选中需要删除的repository,点击进去 2.删除repository 点击进去以后进入新的页面,拉到页面尾部,如图 然后弹出确认框,再输入需要删除的repositor ...

  6. codeforces gym 100971 K Palindromization 思路

    题目链接:http://codeforces.com/gym/100971/problem/K K. Palindromization time limit per test 2.0 s memory ...

  7. [转]fatal error LNK1112: 模块计算机类型“X86”与目标计算机类型“x64”冲突

    来自--------------------- 原文:https://blog.csdn.net/qtbmp/article/details/7273191?utm_source=copy win7 ...

  8. Boostrap本地导入js文件

    我一般都是用CDN直接导入的,但是有时候需要自己添加一些功能进入,会用到本地导入.关于导入路径问题,做个笔记. 使用HBuilder,首先右键导入相应的js/cs文件 然后是常规——>文件系统 ...

  9. 使用git命令行解决冲突

    文章转载自:https://blog.csdn.net/sureSand/article/details/78765727 使用git和提交的代码有所冲突,用IDE自带的git工具功能多了反而不知道怎 ...

  10. Codeforces 101572 D - Distinctive Character

    D - Distinctive Character 思路:bfs 使最大的匹配数最小,转换一下,就是使最小的不匹配数最大,用bfs找最大的距离 代码: #pragma GCC optimize(2) ...