导航：首页 > 开发技术 >

jquery有哪些核心函数

发表于：2024-11-22 作者：千家信息网编辑

千家信息网最后更新 2024年11月22日，这篇文章主要讲解了"jquery有哪些核心函数"，文中的讲解内容简单清晰，易于学习与理解，下面请大家跟着小编的思路慢慢深入，一起来研究和学习"jquery有哪些核心函数"吧！jquery的核心函数：1

千家信息网最后更新 2024年11月22日jquery有哪些核心函数

这篇文章主要讲解了"jquery有哪些核心函数"，文中的讲解内容简单清晰，易于学习与理解，下面请大家跟着小编的思路慢慢深入，一起来研究和学习"jquery有哪些核心函数"吧！

jquery的核心函数：1、jQuery()，主要用于获取HTML DOM元素并将其封装为jQuery对象；2、"jQuery.noConflict()"，用于让渡变量"$"的jQuery控制权。

本教程操作环境：windows7系统、jquery1.10.2版本、Dell G3电脑。

jQuery 核心函数

函数	描述
jQuery()	接受一个字符串，其中包含了用于匹配元素集合的 CSS 选择器。
jQuery.noConflict()	运行这个函数将变量 $ 的控制权让渡给第一个实现它的那个库。

函数说明

jQuery():

jQuery()函数是jQuery库的最核心函数，jQuery的一切都是基于此函数的。该函数主要用于获取HTML DOM元素并将其封装为jQuery对象，以便于使用jQuery对象提供的其他属性和方法对DOM元素进行操作。

jQuery()函数的功能非常强大，它可以将各种类型的参数智能地封装为jQuery对象。

语法

jQuery( selector, [ context ])
将选择器字符串selector所对应的HTML DOM元素封装为jQuery对象。可选参数context用于指定查找DOM元素的范围。
jQuery( [ obj ])
将指定对象obj封装为jQuery对象。这个对象可以是一个DOM元素(Element)，也可以是一个DOM元素数组，也可以是一个jQuery对象(对其进行克隆)，或者其他对象。你也可以省略该参数，从而返回一个空的jQuery对象。

jQuery 1.4 新增省略参数obj的用法：不传入任何参数，将返回空的jQuery对象

jQuery( html, [ ownerDocument ])
根据HTML标签字符串html动态地创建临时DOM元素，并将其封装为jQuery对象。可选参数ownerDocument用于指定临时DOM元素在哪个文档中创建(如果存在多个文档的话，例如框架页面)。

jQuery 1.0 新增该用法。

jQuery(html, properties )
根据HTML标签字符串html和包含其附加属性、事件以及方法的properties对象，动态地创建临时DOM元素，并将其封装为jQuery对象。

jQuery 1.4 新增该用法。

jQuery( callback )
在当前文档载入完成后，执行指定的函数callback。该用法是ready()函数如下用法的简写：jQuery(document).ready(callback)。

jQuery 1.0 新增该用法。

参数

属性	说明
selector	String类型指定的选择器字符串，用于查找对应的DOM元素。
context	可选/Object类型指定选择器字符串的查找范围，可以是DOM元素、DOM元素数组、文档、jQuery对象。如果省略该参数，默认为当前文档。
obj	可选/Object类型指定的对象，用于封装为jQuery对象。可以是DOM元素、DOM元素数组、文档、jQuery对象等。
html	Object类型指定的HTML标签字符串，例如`""、" "、" "`(标签中也可以嵌套标签，只要符合html语法即可)。
ownerDocument	Document类型指定DOM元素在哪个文档上进行临时创建，默认为当前文档。
properties	Object类型指定的对象，用于指定DOM元素的属性、事件和方法。例如：{name:"username", "click":function(){}}
callback	Function类型指定的函数，用于在DOM文档加载完成后立即执行。

返回值

jQuery()函数的返回值是jQuery类型，返回一个jQuery对象。

示例&说明：

jQuery( selector, [ context ])示例代码:

// 选择当前文档中所有的p标签DOM元素$("p");// 选择id属性为username的DOM元素$("#username");// 选择所有包含test样式的DOM元素，(例如：class="test")$(".test");// 选择所有p标签中带test样式的DOM元素$("p .test");

jQuery( [ obj ] 示例代码:

var dom = document.getElementById("username");// 将DOM元素封装为jQuery对象$(dom);var doms = document.getElementsByName("book_id");// 将DOM元素数组封装为jQuery对象$(doms);// 将body元素封装为jQuery对象$(document.body);

jQuery( html, [ ownerDocument ])示例代码:

// 创建一个空的span标签的临时DOM元素，并将其封装为jQuery对象// 以下三种方式的效果一致$('');$('');$(''); // 但不推荐使用这种方式// 创建一个p标签，内部包含带有test样式的span标签$('
');// 创建一个表格var html = '';html += '';html += '';html += '';html += '';html += '';html += '';html += '';html += '';html += '单元格1 单元格2
单元格3 单元格1
';$(html);

jQuery(html, properties )示例代码:

// 创建一个临时的链接jQuery对象var tempLink = $('', {    id: 'goback',    title: 'CodePlayer',    html: 'CodePlayer', // 表示链接的锚文本，也就是innerHTML的值    href: 'http://www.365mini.com/',    click: function(){        // 统计点击次数           }});// 追加到body标签内容的末尾tempLink.appendTo("body");$('', {    type: 'checkbox',    val: 'def', // 表示表单元素的value属性值或textarea的输入内容    click: function(){        alert("点击了复选框");    }}).appendTo("body");

jQuery( callback )示例代码:

$(function(){    // 本文档页面载入完成后自动执行    alert("文档加载完毕!");});// 这相当于ready()函数如下用法的简写$(document).ready(function(){    // 本文档页面载入完成后自动执行    alert("文档加载完毕!");});