文档介绍:jQuery 语法实例
$(this).hide()
演示 jQuery hide() 函数,隐藏当前的 HTML 元素。
$("#test").hide()
演示 jQuery hide() 函数,隐藏 id="test" 的元素。
$("p").hide()
演示 jQuery hide() 函数,隐藏所有<p> 元素。
$(".test").hide()
演示 jQuery hide() 函数,隐藏所有 class="test" 的元素。
首先要知道各种标签等的调用语法,出去自身的this外,其他的调用全部要用""标注,否则是不能被识别的。
然后就是一个非常使用的前置函数:
$(document).ready(function(){
jQuery()
--- jQuery functions go here ----
});
这个函数是可以让所有文档加载完成后才执行内部的js代码。是为了解决某些类名等的调用问题。
然后就是通过元素名称比如类名或者是id名来选择对应的标签例子如下:
jQuery 使用 CSS 选择器来选取 HTML 元素。
$("p") 选取<p> 元素。
$("") 选取所有 class="intro" 的<p> 元素。
$("p#demo") 选取 id="demo" 的第一个<p> 元素。
同样的,jquery也支持某种特定属性的标签选择比如:
jQuery 属性选择器
jQuery 使用 XPath 表达式来选择带有给定属性的元素。
$("[href]") 选取所有带有 href 属性的元素。
$("[href='#']") 选取所有带有 href 值等于"#" 的元素。
$("[href!='#']") 选取所有带有 href 值不等于"#" 的元素。
$("[href$='.jpg']") 选取所有 href 值以".jpg" 结尾的元素。
所以说jquery选择某个标签是非常灵活的,
使用jquery可以非常灵活的对css进行修改:
$("p").css("background-color","red");
属性修改方面要特别注意样式代码和样式名要分别用””标注,并且用“,”隔开。
语法
描述
$(this)
当前 HTML 元素
$("p")
所有<p> 元素
$("")
所有 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" 的元素
通常js调用都放置到<head></head>之中调用,这样的话有助于代码的规范化以及便于后期修改。
触发的函数都是这样表示的,通过前边选取的标签然后加“.”加动作,动作内容里边可以嵌套函数function(){};
$("button").click(function() {..some code... } )
写代码的话一定要保证代码的闭合状态,动作后边要跟();,并且一定要保证是闭合的。
jQuery 名称冲突
jQuery 使用$ 符号作为 jQuery 的简介方式。
某些其他 JavaScript 库中的函数(比如 Prototype)同样使用$ 符号。
jQuery 使用名为 noConflict() 的方法来解决该问题。
var jq=(),帮助您使用自己的名称(比如 jq)来代替$ 符号。
Jquery的几个最常用事件:
Event 函数
绑定函数至
$(document).ready(function)
将函数绑定到文档的就绪事件(当文档完成加载时)
$(selector).click(function)
触发或将函数绑定到被选元素的点击事件
$(selector).dblclick(function)
触发或将函数绑定到被选元素的双击事件
$(selector).focus(function)
触发或将函数绑定到被选元素的获得焦点事件
$(selector).mouseover(function)
触发或将函数绑定到被选元素的鼠标悬停事件
jQuery toggle() 函数使用 show() 或 hide() 函数来切换 HTM