jQuery基础学习(一)

页面添加jQuery

jQuery语法：

$(this).hide():隐藏当前函数
$("p").hide():隐藏所有段落
$(".test").hide():隐藏所有 class="test"的所有元素
$("#test").hide():隐藏所有id="test"的元素

文档就绪函数作用:为了防止文档在完全加载之前运行jQuery代码

$(document).ready(function(){

--- jQuery function go here ---
});

jQuery选择器

可以对元素组或单个元素进行操作。

jQuery元素选择器和属性选择器允许您通过标签名、属性名或内容对HTML元素进行选择。

jQuery元素选择器

jQuery 使用CSS选择器来选取HTML元素

$("p")选取

元素
$("p.intro")选取所有class="intro"的

元素
$("p#demo")选取所有id="demo"的

元素

jQuery属性选择器

$("[href]")选取所有带有href属性的元素

$("[href='#']")选取所有带有href值等于"#"的元素

$("[href!='#']")选取所有带有href值不等于"#"的元素

$("href$='.jpg'")选取所有href值以".jpg"结尾的元素

jQuery CSS选择器

This is a heading

This is a paragaraph.

Click me




当按钮点击事件被触发时会调用一个函数:
$("button").click(function(){... some code ...})

jQuery名称冲突

jQuery使用$符号作为jQuery的简介方式。
某些其他JavaScript库中的函数(比如Prototype)同样使用$符号作为jQuery的简介方式。
jQuery使用名为noConflict()方法来解决该问题

var jq=jQuery.noConflict();

jQuery事件：

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