JQuery学习笔记（一）

参考菜鸟教程http://www.runoob.com/jquery/jquery-intro.html，和《锋利的JQuery》

jQuery是一个JavaScript函数库。是目前最流行的 JS 框架，而且提供了大量的扩展。

安装：下载，或者使用CDN

<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>

语法： $(selector).action() 比如：$("#test").hide()

如果在文档没有完全加载之前就运行JQuery代码，操作可能失败，所以要在文档加载完成后运行函数。

$(document).ready(function(){

   // jQuery methods go here...

});

或者

$(function(){

   // jQuery methods go here...

});

JQuery选择器：

JQuery选择器完全继承了CSS的风格，写法十分简洁，处理机制完善。

如果html没有id为XX的元素，使用getElementById会报错，而使用$('#xx')获取元素，则不需要判断是否存在。

但是当判断元素是否存在是，由于$('#xx')获取的是对象，不能if($('#xx')),而是if($('#xx').length>0)或者转化为DOM对象判断if($('#xx')[0])。

JQuery学习笔记（一）

常见事件：

JQuery学习笔记（一）

触发点击事件：

$("p").click(function(){
  // action goes here!!
});

Mousedown和click的区别：click事件包含了Mousedown与MouseUp

同样，hover()方法用于模拟光标悬停事件。当鼠标移动到元素上时，会触发指定的第一个函数(mouseenter);当鼠标移出这个元素时，会触发指定的第二个函数(mouseleave)。

$(document).ready(function(){
  $("#p1").hover(function(){
    alert("You entered p1!");
    },
    function(){
    alert("Bye! You now leave p1!");
  }); 
});

JQuery学习笔记（一）

相关推荐