首页 > Web开发 > 详细

jQuery基础学习

时间:2017-07-09 19:05:06      阅读:248      评论:0      收藏:0      [点我收藏+]

1.广受欢迎的 JavaScript 框架:

  • jQuery
  • Prototype
  • MooTools
  • 这些框架都提供针对常见 JavaScript 任务的函数,包括动画、DOM 操作以及 Ajax 处理

2.jQuery 使用 CSS 选择器(即html元素)来访问和操作网页上的 HTML 元素(DOM 对象)。

3.jQuery 是一个 JavaScript 函数库。

  jQuery 库包含以下特性:

    HTML 元素选取

    HTML 元素操作

    CSS 操作

    HTML 事件函数

    JavaScript 特效和动画

    HTML DOM 遍历和修改

    AJAX

    Utilities

4.jQuery 库位于一个 JavaScript 文件中,其中包含了所有的 jQuery 函数

  

    可以通过下面的标记把 jQuery 添加到网页中:

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

    注意,<script> 标签应该位于页面的 <head> 部分。

5.通过 jQuery,您可以选取(查询,query) HTML 元素,并对它们执行“操作”(actions)

      jQuery 语法实例

                      $(this).hide()        演示 jQuery hide() 函数,隐藏当前的 HTML 元素。
            $("#test").hide()      演示 jQuery hide() 函数,隐藏 id="test" 的元素。
                      $("p").hide()                   演示 jQuery hide() 函数,隐藏所有 <p> 元素。
                     $(".test").hide()               演示 jQuery hide() 函数,隐藏所有 class="test" 的元素。
6.jQuery 语法是为 HTML 元素的选取编制的,可以对元素执行某些操作。

  基础语法是:$(selector).action()

     美元符号$定义 jQuery选择符。

    (selector)“查询”和“查找” HTML 元素

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

7.所有 jQuery 函数位于一个 document ready 函数中,这是为了防止文档在完全加载(就绪)之前运行 jQuery 代码

8.jQuery选择器:选择器允许您对元素组或单个元素进行操作

  

$(this) 当前 HTML 元素
$("p") 所有 <p> 元素
$("p.intro") 所有 class="intro" 的 <p> 元素
$(".intro") 所有 class="intro" 的元素
$("#intro") id="intro" 的元素
$("ul li:first") 每个 <ul> 的第一个 <li> 元素
$("[href$=‘.jpg‘]") 所有带有以 ".jpg" 结尾的属性值的 href 属性
$("div#intro .head") id="intro" 的 <div> 元素中的所有 class="head" 的元素

9.jQuery事件:是为事件处理特别设计的。事件处理程序指的是当 HTML 中发生某些事件时所调用的方法

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

10.如果您的网站包含许多页面,并且您希望您的 jQuery 函数易于维护,那么请把您的 jQuery 函数放到独立的 .js 文件中。

 而不要直接在html中的<script>标签中直接书写jQuery函数。直接采用在<script>标签中使用src属性来引用外部文件。

11.

jQuery 使用 $ 符号作为 jQuery 的简介方式。

某些其他 JavaScript 库中的函数(比如 Prototype)同样使用 $ 符号。

jQuery 使用名为 noConflict() 的方法来解决该问题。

var jq=jQuery.noConflict(),帮助您使用自己的名称(比如 jq)来代替 $ 符号。

12.

 jQuery 是为处理 HTML 事件而特别设计的,那么当您遵循以下原则时,您的代码会更恰当且更易维护:

  • 把所有 jQuery 代码置于事件处理函数中
  • 把所有事件处理函数置于文档就绪事件处理器中
  • 把 jQuery 代码置于单独的 .js 文件中
  • 如果存在名称冲突,则重命名 jQuery 库

13.

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

Event 函数绑定函数至
$(document).ready(function) 将函数绑定到文档的就绪事件(当文档完成加载时)
$(selector).click(function) 触发或将函数绑定到被选元素的点击事件
$(selector).dblclick(function) 触发或将函数绑定到被选元素的双击事件
$(selector).focus(function) 触发或将函数绑定到被选元素的获得焦点事件
$(selector).mouseover(function) 触发或将函数绑定到被选元素的鼠标悬停事件

 



 

jQuery基础学习

原文:http://www.cnblogs.com/yyzyxy/p/7142430.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!