`
北海肥猫
  • 浏览: 27995 次
  • 性别: Icon_minigender_1
  • 来自: 石家庄
社区版块
存档分类
最新评论

jQuery 简介

jQuery 
阅读更多

jQuery 是一个 JavaScript 库，它极大地简化了 JavaScript 编程。


1、jQuery 库包含以下特性：

  • HTML 元素选取
  • HTML 元素操作
  • CSS 操作
  • HTML 事件函数
  • JavaScript 特效和动画
  • HTML DOM 遍历和修改
  • AJAX
  • Utilities

2、如何向您的页面添加 jQuery 库？

如需使用 jQuery，您需要下载 jQuery 库，然后把它包含在希望使用的网页中。
下载jQuery：http://jquery.com/download/

 

jQuery 库是一个 JavaScript 文件，您可以使用 HTML 的 <script> 标签引用它：

<head>
<script src=".../jquery.js"></script>
</head>

 

3、jQuery 语法

jQuery 语法是为 HTML 元素的选取编制的，可以对元素执行某些操作。

 

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

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

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

 4、jQuery选择器

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

 

（1）jQuery 元素选择器

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

$("p");     //选取 <p> 元素。
$("p.intro");     //选取所有 class="intro" 的 <p> 元素。
$("p#demo");     //选取所有 id="demo" 的 <p> 元素。

 （2）jQuery 属性选择器

jQuery 使用 XPath 表达式来选择带有给定属性的元素。

$("[href]");     //选取所有带有 href 属性的元素。
$("[href='#']");     //选取所有带有 href 值等于 "#" 的元素。
$("[href!='#']");      //选取所有带有 href 值不等于 "#" 的元素。
$("[href$='.jpg']");     //选取所有 href 值以 ".jpg" 结尾的元素。

 

更多的选择器实例：

$(this);	     //当前 HTML 元素
$("p");	             //所有 <p> 元素
$("p.intro");	     //所有 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" 的元素

 

分享到：
| Java Script 字符串操作
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics