jquery的核心函数:1、jQuery(),主要用于获取HTML DOM元素并将其封装为jQuery对象;2、“jQuery.noConflict()”,用于让渡变量“$”的jQuery控制权。
本教程操作环境:windows7系统、jquery1.10.2版本、Dell G3电脑。
jQuery 核心函数
函数 | 描述 |
---|---|
jQuery() | 接受一个字符串,其中包含了用于匹配元素集合的 CSS 选择器。 |
jQuery.noConflict() | 运行这个函数将变量 $ 的控制权让渡给第一个实现它的那个库。 |
jQuery()函数是jQuery库的最核心函数,jQuery的一切都是基于此函数的。该函数主要用于获取HTML DOM元素并将其封装为jQuery对象,以便于使用jQuery对象提供的其他属性和方法对DOM元素进行操作。
jQuery()函数的功能非常强大,它可以将各种类型的参数智能地封装为jQuery对象。
jQuery 1.4 新增省略参数obj的用法:不传入任何参数,将返回空的jQuery对象
jQuery 1.0 新增该用法。
jQuery 1.4 新增该用法。
jQuery 1.0 新增该用法。
属性 | 说明 | ||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
selector |
|
||||||||||||||||
context | 可选/Object类型 指定选择器字符串的查找范围,可以是DOM元素、DOM元素数组、文档、jQuery对象。如果省略该参数,默认为当前文档。 | ||||||||||||||||
obj | 可选/Object类型 指定的对象,用于封装为jQuery对象。可以是DOM元素、DOM元素数组、文档、jQuery对象等。 | ||||||||||||||||
html | Object类型 指定的HTML标签字符串,例如"a6f776b766579c28d02706af09482172"、"e388a4556c0f65e1904146cc1a846bee94b3e26ee717c64999d7867364b1b4a3"、"d0659237eeb5c5f8cf72d25d81da40c994b3e26ee717c64999d7867364b1b4a3" (标签中也可以嵌套标签,只要符合html语法即可)。 |
||||||||||||||||
ownerDocument | Document类型 指定DOM元素在哪个文档上进行临时创建,默认为当前文档。 | ||||||||||||||||
properties | Object类型 指定的对象,用于指定DOM元素的属性、事件和方法。例如:{name:”username”, “click”:function(){}} | ||||||||||||||||
callback | Function类型 指定的函数,用于在DOM文档加载完成后立即执行。 |
jQuery()函数的返回值是jQuery类型,返回一个jQuery对象。
// 选择当前文档中所有的p标签DOM元素 $("p"); // 选择id属性为username的DOM元素 $("#username"); // 选择所有包含test样式的DOM元素,(例如:class="test") $(".test"); // 选择所有p标签中带test样式的DOM元素 $("p .test");
var dom = document.getElementById("username"); // 将DOM元素封装为jQuery对象 $(dom); var doms = document.getElementsByName("book_id"); // 将DOM元素数组封装为jQuery对象 $(doms); // 将body元素封装为jQuery对象 $(document.body);
// 创建一个空的span标签的临时DOM元素,并将其封装为jQuery对象 // 以下三种方式的效果一致 $('<span/>'); $('<span></span>'); $('<span>'); // 但不推荐使用这种方式 // 创建一个p标签,内部包含带有test样式的span标签 $('<p><span class="test"></span></p>'); // 创建一个表格 var html = '<table>'; html += '<tr>'; html += '<td>单元格1</td>'; html += '<td>单元格2</td>'; html += '</tr>'; html += '<tr>'; html += '<td>单元格3</td>'; html += '<td>单元格1</td>'; html += '</tr>'; html += '</table>'; $(html);
// 创建一个临时的链接jQuery对象 var tempLink = $('<a/>', { id: 'goback', title: 'CodePlayer', html: 'CodePlayer', // 表示链接的锚文本,也就是innerHTML的值 href: 'http://www.365mini.com/', click: function(){ // 统计点击次数 } }); // 追加到body标签内容的末尾 tempLink.appendTo("body"); $('<input/>', { type: 'checkbox', val: 'def', // 表示表单元素的value属性值或textarea的输入内容 click: function(){ alert("点击了复选框"); } }).appendTo("body");
$(function(){ // 本文档页面载入完成后自动执行 alert("文档加载完毕!"); }); // 这相当于ready()函数如下用法的简写 $(document).ready(function(){ // 本文档页面载入完成后自动执行 alert("文档加载完毕!"); });
noConflict() 方法让渡变量 $ 的 jQuery 控制权。
该方法释放 jQuery 对 $ 变量的控制。
该方法也可用于为 jQuery 变量规定新的自定义名称。
提示:在其他 JavaScript 库为其函数使用 $ 时,该方法很有用。
语法:jQuery.noConflict(removeAll)
removeAll 布尔值。指示是否允许彻底将 jQuery 变量还原。
相关视频教程推荐:jQuery教程(视频)
以上是jquery的核心函数有哪些的详细内容。更多信息请关注PHP中文网其他相关文章!