示例

说明:

动态创建一个div元素（以及其中的所有内容），并将它追加到ID值为body的元素中。在这个函数的内部，是通过临时创建一个元素，并将这个元素的innerHTML属性设置为给定的标记字符串，来实现标记到DOM元素转换的。所以，这个函数既有灵活性，也有局限性。

jQuery 代码:

1$("<div><p>Hello</p></div>").appendTo("#body")

示例

说明:

与 $("div > p") 相同。

HTML 代码:

jQuery 代码:

结果:

说明:

把页面的背景颜色设置为黑色。

jQuery 代码:

说明:

隐藏表单中的所有input元素。

jQuery 代码:

$(fn)

$(document). ready()的简写方式，允许你绑定一个在DOM文档载入完成后执行的函数。这个函数的作用如同$(document).ready()一样，只不过用 这个函数时，需要把页面中所有其他的$()操作符都包装到其中来。从技术上来说，这个函数是可链接的－－但真正以这种方式链接的情况并不多。你可以在一个 页面中使用任意多个$(document).ready事件。 要详细了解ready事件，见ready(Function)。

A shorthand for $(document).ready(), allowing you to bind a function to be executed when the DOM document has finished loading. This function behaves just like $(document).ready(), in that it should be used to wrap all of the other $() operations on your page. While this function is, technically, chainable - there really isn't much use for chaining against it. You can have as many $(document).ready events on your page as you like. See ready(Function) for details about the ready event.

返回值

jQuery

参数

• fn (Function): 当DOM载入完成后要执行的函数

示例

说明:

当DOM就绪可用时，执行其中的函数。

jQuery 代码:

$(function(){ // DOM文档已经载入就绪 });


$(expr, context)

这 个函数接收一个包含CSS或基本的XPath选择符的字符串，然后用这个字符串去匹配一组元素。 jQuery的核心功能都是通过这个函数实现的。 jQuery中的一切都构建于这个函数之上，或者说都是在以某种方式使用这个函数。这个函数最基本的用法就是向它传递一个表达式（通常由CSS或 XPath选择符组成），然后根据这个表达式来查询所有匹配的元素。 在默认情况下，$()查询的是当前HTML文档中的DOM元素。

This function accepts a string containing a CSS or basic XPath selector which is then used to match a set of elements. The core functionality of jQuery centers around this function. Everything in jQuery is based upon this, or uses this in some way. The most basic use of this function is to pass in an expression (usually consisting of CSS or XPath), which then finds all matching elements. By default, $() looks for DOM elements within the context of the current HTML document.

返回值

jQuery

参数

• expr (String): 用来查询用的字符串
• context (Element|jQuery): （可选）作为上下文的DOM元素、文档或jQuery对象。

示例

说明:

找到所有是div元素子元素的p元素。

HTML 代码:

<p>one</p> <div><p>two</p></div> <p>three</p>

jQuery 代码:

$("div > p")

结果:

[ <p>two</p> ]

---

说明:

在文档的第一个表单中，搜索所有单选按钮（或：type值为radio的input元素）。

jQuery 代码:

$("input:radio", document.forms[0])

---

说明:

查询指定XML文档中的所有div元素。

jQuery 代码:

$("div", xml.responseXML)

$.extend(prop)

扩展jQuery对象。可以用于把函数添加到jQuery名称空间中，以及添加插件方法（插件）。

Extends the jQuery object itself. Can be used to add functions into the jQuery namespace and to add plugin methods (plugins).

返回值

Object

参数

• prop (Object): 要合并到jQuery对象中的对象

示例

说明:

添加两个插件方法。

jQuery 代码:

1 jQuery.fn.extend( { check:  function ()  {  return   this .each( function ()  {  this .checked  =   true ; } ); } , uncheck:  function ()  {  return   this .each( function ()  {  this .checked  =   false ; } ); }  } ); $( " input[@type=checkbox] " ).check(); $( " input[@type=radio] " ).uncheck(); 

---

说明:

向jQuery名称空间中添加两个函数。

jQuery 代码:

jQuery.extend({ min: function(a, b) { return a < b ? a : b; }, max: function(a, b) { return a > b ? a : b; } });

示例

说明:

将$引用的对象映射回原始的对象，让渡变量$

jQuery 代码:

1 jQuery.noConflict();  //  开始使用jQuery jQuery("div p").hide(); // 使用其他库的 $() $("content").style.display = 'none'; 

说明:

恢复使用别名$，然后创建并执行一个函数，在这个函数的作用域中仍然将$作为jQuery的别名来使用。在这个函数中，原来的$对象是无效的。这个函数对于大多数不依赖于其他库的插件都十分有效。

jQuery 代码:

1jQuery.noConflict(); (function($) { $(function() { // 使用 $ 作为 jQuery 别名的代码 }); })(jQuery); // 使用 $ 作为别名的其他库的代码

示例

HTML 代码:

jQuery 代码:

结果:

get()

取得所有匹配的（DOM）元素集合。这是取得所有匹配元素的一种向后兼容的方式（不同于jQuery对象，而实际上两者都是元素数组）。

Access all matched elements. This serves as a backwards-compatible way of accessing all matched elements (other than the jQuery object itself, which is, in fact, an array of elements).

返回值

Array<Element>