1、jquery安装

<head> <script src="jquery-1.10.2.min.js"></script> </head>

2、jquery语法

基础语法： $(selector).action()

  • 美元符号定义 jQuery
  • 选择符（selector）"查询"和"查找" HTML 元素
  • jQuery 的 action() 执行对元素的操作

实例:

文档就绪：$(document).ready(function(){ //入口编辑代码

// 开始写 jQuery 代码...

});

 

  • $(this).hide() - 隐藏当前元素

  • $("p").hide() - 隐藏所有 <p> 元素

  • $("p.test").hide() - 隐藏所有 class="test" 的 <p> 元素

  • $("#test").hide() - 隐藏所有 id="test" 的元素

这是为了防止文档在完全加载（就绪）之前运行 jQuery 代码，即在 DOM 加载完成后才可以对 DOM 进行操作。

如果在文档没有完全加载之前就运行函数，操作可能失败

简写：效果同上一样

 $(function(){

// 开始写 jQuery 代码...

});

jQuery 入口函数:

$(document).ready(function(){
    // 执行代码
});
或者
$(function(){
    // 执行代码
});

JavaScript 入口函数:

window.onload = function () {
    // 执行代码
}

jQuery 入口函数与 JavaScript 入口函数的区别：

 

  •  jQuery 的入口函数是在 html 所有标签(DOM)都加载之后，就会去执行。
  •  JavaScript 的 window.onload 事件是等到所有内容，包括外部图片之类的文件加载完后，才会执行。

3、选择器

jQuery 选择器基于元素的 id、类、类型、属性、属性值等"查找"（或选择）HTML 元素

jQuery 中所有选择器都以美元符号开头：$()。

4、jQuery效果

通常都是选择器选中元素，然后函数名称(参数-速度，回调函数-效果完成后运行的自定义函数)

如：$(selector).animate({params},speed,callback);

必需的 params 参数定义形成动画的 CSS 属性。

可选的 speed 参数规定效果的时长。它可以取以下值："slow"、"fast" 或毫秒。

可选的 callback 参数是动画完成后所执行的函数名称。

$("button").click(function(){ $("div").animate({left:'250px'}); });

5、jQuery HTML

获得内容 - text()、html() 以及 val()

获取属性 - attr()

$("#runoob").attr("href")

<a href="http://www.runoob" id="runoob">菜鸟教程</a>

 

 

更多推荐

jQuery学习(菜鸟教程)