jQuery简明教程

本文参考w3cshool中文教程,网址:http://www.w3school.com.cn/jquery/index.asp

简介

  • jQuery是一个Javascript库,使用其的主要目的是简化Javascript的使用。
  • 将jQuery引入网页中的方法: <head><script type="text/javascript" src="[jQuery库的文件路径]"></script></head>
    注:HTML5不需要加type="text/javascript"

jQuery选择器

  • $(this)当前HTML元素
  • $("tag")所有标签为tag的元素,如$("p")选择了所有<p>元素
  • $(".class")所有class="class"的元素,如$(".intro")选择了所有class="intro"的元素
  • $("tag.class")选择所有标签为tag且class="class"的元素
  • $("#id")所有id为id的元素,如$("#userName")选择了所有id为userName的元素
  • $("tag sub_tag:first")选择了每个标签为tag下的子标签为sub_tag的元素
  • $("tag#id.class")选择限定id且tag的所有class="class"的元素

jQuery事件

jQuery常见的事件:
  • $(document).ready(functino)文档加载完成后,将函数绑定到文档的就绪事件
  • $(selector).click(function)将函数绑定到被选元素的点击事件
  • $(selector).dbclick(function)将函数绑定到被选元素的双击事件
  • $(selector).focus(function)将函数绑定到被选元素的获得焦点事件
  • $(selector).mouseover(function)将函数绑定到被选元素的鼠标悬停事件
    示例:$("button").click(function(){some code...})选取标签为button的元素,并将函数绑定到该元素上