菜单

jQuery中$.extend()用法实例

2019年5月24日 - XML

正文实例讲述了jQuery中$原理。分享给我们供大家参照他事他说加以考察,具体如下:

jQuery中$.extend()用法实例

   本文实例讲述了jQuery中$.extend()用法。分享给大家供我们参照他事他说加以考察。具体深入分析如下:

  $.extend()方法定义如下:

  jQuery.extend([deep], target, object1, [objectN])

  用2个或八个其余对象来扩张学一年级个对象,再次回到被扩大的目的。

  借使不钦命target,则给jQuery命名空间本人进行扩张。这促进插件小编为jQuery扩充新措施。
借使第5个参数设置为true,则jQuery重临二个深档次的别本,递归地复制找到的别的对象。否则的话,别本会与原对象共享结构。
未定义的性格将不会被复制,然则从目的的原型承继的属性将会被复制。

  看上边包车型大巴代码就清楚怎么用了,请看:

  ?

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"

"http://www.w3.org/TR/html4/strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>extendFun</title>

<script src="../scripts/jquery-1.9.0.js" type="text/javascript"></script>

<meta name="author" content="Administrator" />

<!– Date: 2013-01-30 –>

<script type="text/javascript">

$(function () {

var pageConfig= {};

var pageConfig=$.extend(pageConfig,{

createUrl: ‘${ROOT}/subject/createOrModifyPageTemplates’,

deleteUrl: ‘${ROOT}/subject/deletePageTemplates’,

modifyUrl: ‘${ROOT}/subject/createOrModifyPageTemplates’,

infoName: ‘pageTemplateInfo’

});

$("#subm").click(function(){

var posturl= pageConfig.deleteUrl;

alert(posturl);

});

})

</script>

</head>

<body>

<input id="subm" name="subm" type="button" value="clickme" >

</body>

</html>

  输出结果:${ROOT}/subject/deletePageTemplates

  希望本文所述对我们的jQuery程序设计有着支持。

http://www.bkjia.com/Javascript/1021540.htmlwww.bkjia.comtruehttp://www.bkjia.com/Javascript/1021540.htmlTechArticlejQuery中$.extend()用法实例
本文实例讲述了jQuery中$.extend()用法。分享给大家供我们参谋。具体解析如下:
$.extend()方法定义如下: jQuery.exten…

壹、外层沙箱及命名空间$

为了防止阐明了有些全局变量而污染,把代码放在二个“沙箱施行”,jQuery具体的贯彻,都被含有在了二个马上实践函数构造的闭包里面,然后在暴暴露命名空间(可感到API,函数,对象),如只暴露$ 和 jQuery 那2个变量给外界:

(function(window, undefined) {
  // 用一个函数域包起来,就是所谓的沙箱
    // 在这里边var定义的变量,属于这个函数域内的局部变量,避免污染全局
  // 把当前沙箱需要的外部变量通过函数参数引入进来
    // 只要保证参数对内提供的接口的一致性,还可以随意替换传进来的这个参数
  "use strict";
  window.jQuery = window.$ = jQuery;
  ... // jQuery代码
}) (window);

jQuery有三个对准压缩优化细节,在代码压缩时,window和undefined都能够减掉为二个字母且确定保证它们便是window和undefined。外层函数只传了3个参数,由此沙箱施行时,u自然会undefined,把捌个字母缩成一个假名,能够观望压缩后的代码收缩一些字节数。

// 压缩策略
// w -> window , u -> undefined
(function(w, u) {
  "use strict";
  w.jQuery = w.$ = jQuery;
  var a;
  if (a == u)
    return;
})(window);

2、jQuery 无 new 构造

实例化八个jQuery对象的艺术:

$('#text').text('myJQuery'); // 无 new 构造

等价于:

var text = new $('#text');
text.text('myJQuery');

行使jQuery时相像都接纳无new的构造格局,直接$('')进行理并了结构,那也是jQuery十三分轻巧的二个地方。当使用无new结构方式时,其本质是一定于new jQuery(),在jQuery内部的贯彻方式是:

(function(window, undefined) {
  // ...
  jQuery = function(selector, context) {
    // 实例化方法jQuery()实际上是调用了其拓展的原型方法 jQuery.fn.init
    return new jQuery.fn.init(selector, context, rootjQuery);
  },
  // jQuery.prototype是jQuery的原型,挂载在上面的方法,即可让所有生成的jQuery对象使用
  jQuery.fn = jQuery.prototype = {
    // 实例化方法,这个方法可以称作 jQuery 对象构造器
    init: function(selector, context, rootjQuery) {
          // ...
    }
  }
  // jQuery 没有使用 new 运算符将 jQuery 实例化,而是直接调用其函数
  // 要实现这样,那么 jQuery 就要看成一个类,且返回一个正确的实例,且实例还要能正确访问 jQuery 类原型上的属性与方法
  // jQuery 的方式是通过原型传递解决问题,把 jQuery 的原型传递给jQuery.prototype.init.prototype,所以通过这个方法生成的实例 this 所指向的仍然是 jQuery.fn,所以能正确访问 jQuery 类原型上的属性与方法
  jQuery.fn.init.prototype = jQuery.fn;
})(window);

1) 使用$('xxx')这种实例化方式,其内部调用的是
return new jQuery.fn.init(selector, context, rootjQuery)
这一句话,也等于布局实例是付诸了 jQuery.fn.init() 方法去完结。

2) 将 jQuery.fn.init 的 prototype
属性设置为 jQuery.fn,那么使用 new jQuery.fn.init()
生成的目的的原型对象正是 jQuery.fn ,所以挂载到 jQuery.fn
上边的函数就一定于挂载到 jQuery.fn.init() 生成的 jQuery
对象上,全数应用 new jQuery.fn.init() 生成的指标也能够访问到 jQuery.fn
上的富有原型方法。

三) 实例化方法存在这样2个事关链 :

① jQuery.fn.init.prototype = jQuery.fn = jQuery.prototype ;

② new jQuery.fn.init()相当于 new jQuery() ;

叁 jQuery() 再次来到的是 new jQuery.fn.init(),而
var obj = new jQuery(),所以那 贰 者是一定的,所以我们可以无 new 实例化
jQuery 对象。

越多关于jQuery相关内容感兴趣的读者可查看本站专项论题:《jQuery扩展本领总括》、《jQuery常用插件及用法计算》、《jQuery表格(table)操作手艺汇总》、《jQuery常见精粹特效汇总》及《jquery选择器用法计算

可望本文所述对我们jQuery程序设计具备扶助。

你也许感兴趣的小说:

相关文章

发表评论

电子邮件地址不会被公开。 必填项已用*标注

网站地图xml地图