网络编程
位置：首页>> 网络编程>> JavaScript>> jQuery使用手册--核心篇(Core)

jQuery使用手册--核心篇(Core)

作者：Young.J　来源：jquery.org.cn　发布时间：2007-11-22 22:05:00　

标签：jQuery,手册

翻译整理：Young.J；官方网站：http://jquery.com

jQuery是一款同prototype一样优秀js开发库类，特别是对css和XPath的支持，使我们写js变得更加方便！

如果你不是个js高手又想写出优 秀的js效果，jQuery可以帮你达到目的！

下载地址：Starterkit （http://jquery.bassistance.de/jquery-starterkit.zip）

jQuery 官方下载（http://jquery.com/src/）或本站下载

下载完成后先加载到文档中，然后我们来看个简单的例子！


<script language="javascript" type="text/javascript">   
    $(document).ready(function(){
        $("a").click(function(){
        alert("Hello world!");
   });
});
<script>


上边的效果是点击文档中所有a标签时将弹出对话框，$("a") 是一个jQuery选择器，$本身表示一个jQuery类，所有$()是构造一个jQuery对象，click()是这个对象的方法，同理$(document)也是一个jQuery对象，ready(fn)是$(document)的方法，表示当document全部下载完毕时执行函数。

在进行下面内容之前我还要说明一点$("p")和$("#p")的区别,$("p")表示取所有p标签(<p></p>)的元素,$("#p")表示取id为"p"(<span  id="p"></span>)的元素.

本文将主要来讲解jQuery的核心部分的使用:

$(expr)

说明：该函数可以通过css选择器，Xpath或html代码来匹配目标元素，所有的jQuery操作都以此为基础

参数：expr：字符串，一个查询表达式或一段html字符串

例子：未执行jQuery前：


<p>one</p>
<div>
      <p>two</p>
</div>
    <p>three</p>
    <a href="#" id="test" onClick="jq()" >jQuery</a>


jQuery代码及功能：


function jq(){  
    alert($("div > p").html());  
}


运行：当点击id为test的元素时，弹出对话框文字为two，即div标签下p元素的内容


function jq(){
    $("<div><p>Hello</p></div>").appendTo("body");
}


运行：当点击id为test的元素时，向body中添加“<div><p>Hello</p></div>”

1
2 3 4 5 下一页
0
投稿

猜你喜欢

手机版 网络编程 asp之家 www.aspxhome.com