浅谈Jquery核心函数


Posted in Javascript onJune 18, 2015

      在Jquery中,所有的DOM对象都将封装成Jquery对象,而且只有Jquery对象才能使用Jquery方法或者属性来执行相应的操作。

所以Jquery提供了一个可以将DOM对象封装成Jquery对象的函数,就是Jquery核心函数jquery(),也称为工厂函数。

jquery核心函数有7个重载,分别如下:

jquery()  该函数返回一个空的jquery对象。
jquery(elements)  该函数将一个或多个DOM元素转化为Jquery对象(或jquery集合)
jquery(callback)     该函数是jquery(document).ready(callback)的简写。 该函数将绑定一个在DOM文档载入完成后执行的函数。页面中所有需要在DOM加载完成时,执行的jquery操作,都需要包含在这个函数中。这个函数,可以在页面中,出现多次。
jquery(expression,[context])
jquery(html)
jquery(html,props)
jquery(html,[ownerDocument])

我们详细来看下其中的

jQuery(expression, [context])

这个函数接收一个包含 CSS 选择器的字符串,然后用这个字符串去匹配一组元素。

通过 doc[0]、doc[1] 可以分别取出一个 DOM 对象,其它的则是一些 jQuery 对象特有的属性和方法;实际上 jQuery 对象包装了 DOM 对象,同时还包含了一些操作 DOM 元素的 jQuery 方法。

在使用 jQuery 的过程中,大部分情况下第一步工作同时也是最重要的一步工作,就是取得包装了要操作 DOM 对象的 jQuery 对象;然后通过调用取得的 jQuery 对象的方法来完成对 DOM 对象的操作。

for example

1.查找#first context中节点为p的搜有元素,并循环显示对应的值。

$(function() {
    var items = $("p", "#first");
    $.each(items, function(i, n) {
      alert(i);
    });
  });

 i为对应的index,n对应的节点

2.找到所有 p 元素,并且这些元素都必须是 div 元素的子元素。

HTML 代码:
<p>one</p> <div><p>two</p></div> <p>three</p>

jQuery 代码:
$("div > p");<br>

结果:
[ <p>two</p> ]

3.在文档的第一个表单中,查找所有的单选按钮(即: type 值为 radio 的 input 元素)。

jQuery 代码:
$("input:radio", document.forms[0]);
                                                                                                                                                     

jQuery(html, [ownerDocument])

根据提供的原始 HTML 标记字符串,动态创建由 jQuery 对象包装的 DOM 元素。

你可以传递一个手写的 HTML 字符串,或者由某些模板引擎或插件创建的字符串,也可以是通过 AJAX 加载过来的字符串。

jQuery(html, props)

根据提供的原始 HTML 标记字符串,动态创建由 jQuery 对象包装的 DOM 元素。同时设置一系列的属性、事件等。

参数

htmlString

用于动态创建DOM元素的HTML标记字符串

propsMap

用于附加到新创建元素上的属性、事件和方法

示例

描述:

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

jQuery 代码:

$("<div>", {
 "class": "test",
 text: "Click me!",
 click: function(){
  $(this).toggleClass("test");
 }
}).appendTo("body");

$(document).ready()的简写。

当DOM加载完成后,执行其中的函数。

jQuery 代码:

$(function(){
 // 文档就绪
});

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
JavaScript延迟加载
Mar 09 Javascript
基于jquery完美拖拽,可返回拖动轨迹
Mar 29 Javascript
关于JavaScript的面向对象和继承有利新手学习
Jan 11 Javascript
checkbox全选所涉及到的知识点介绍
Dec 31 Javascript
javascript字符串对象常用api函数小结(连接,替换,分割,转换等)
Sep 20 Javascript
Vue.js教程之计算属性
Nov 11 Javascript
vue2实现移动端上传、预览、压缩图片解决拍照旋转问题
Apr 13 Javascript
vue脚手架及vue-router基本使用
Apr 09 Javascript
移动端底部导航固定配合vue-router实现组件切换功能
Jun 13 Javascript
layer页面跳转,获取html子节点元素的值方法
Sep 27 Javascript
使用PreloadJS加载图片资源的基础方法详解
Feb 03 Javascript
基于原生js实现九宫格算法代码实例
Jul 03 Javascript
$.extend 的一个小问题
Jun 18 #Javascript
纯js实现无限空间大小的本地存储
Jun 18 #Javascript
JS实现当前页居中分页效果的方法
Jun 18 #Javascript
javascript中Date()函数在各浏览器中的显示效果
Jun 18 #Javascript
javaScript中Math()函数注意事项
Jun 18 #Javascript
理解Javascript的动态语言特性
Jun 17 #Javascript
你所不了解的javascript操作DOM的细节知识点(一)
Jun 17 #Javascript
You might like
全国FM电台频率大全 - 2 天津市
2020/03/11 无线电
PHP+jQuery+Ajax实现分页效果 jPaginate插件的应用
2015/10/09 PHP
JavaScript地图拖动功能SpryMap的简单实现
2013/07/17 Javascript
JQuery操作单选按钮以及复选按钮示例
2013/09/23 Javascript
IE6已终止操作问题的2种情况及解决
2014/04/23 Javascript
JavaScript中的函数嵌套使用
2015/06/04 Javascript
jQuery实现文本框输入同步的方法
2015/06/20 Javascript
提高jQuery性能优化的技巧
2015/08/03 Javascript
jQuery实现图片上传和裁剪插件Croppie
2015/11/29 Javascript
JS实现仿百度文库评分功能
2017/01/12 Javascript
使用gulp搭建本地服务器并实现模拟ajax
2017/04/05 Javascript
JavaScript实现各种排序的代码详解
2017/08/28 Javascript
利用ES6实现单例模式及其应用详解
2017/12/09 Javascript
JavaScript实现shuffle数组洗牌操作示例
2019/01/03 Javascript
jquery 验证用户名是否重复代码实例
2019/05/14 jQuery
JS操作Fckeditor的一些常用方法(获取、插入等)
2020/02/19 Javascript
基于JS正则表达式实现模板数据动态渲染(实现思路详解)
2020/03/07 Javascript
[42:32]DOTA2上海特级锦标赛B组资格赛#2 Fnatic VS Spirit第二局
2016/02/27 DOTA
[01:34]2016国际邀请赛中国区预选赛IG战队教练采访
2016/06/27 DOTA
Python3处理文件中每个词的方法
2015/05/22 Python
Python中函数的参数定义和可变参数用法实例分析
2015/06/04 Python
python+opencv实现动态物体识别
2018/01/09 Python
python使用pycharm环境调用opencv库
2018/02/11 Python
python 实现数字字符串左侧补零的方法
2018/12/04 Python
Python通过VGG16模型实现图像风格转换操作详解
2020/01/16 Python
工业自动化毕业生自荐信范文
2014/01/04 职场文书
个人贷款担保书
2014/04/01 职场文书
春节请假条
2014/04/11 职场文书
学校安全生产承诺书
2014/05/23 职场文书
干部个人对照检查材料
2014/08/25 职场文书
《我爱祖国》演讲稿1000字
2014/09/26 职场文书
病危通知书样本
2015/04/17 职场文书
团支部书记竞选稿
2015/11/21 职场文书
2016秋季运动会前导词
2015/11/25 职场文书
李清照的诗词赏析(20首)
2019/08/22 职场文书
导游词之永济鹳雀楼
2020/01/16 职场文书