`

jquery extends

阅读更多

 $.extend()

因为项目中有些地方看到有用到这个方法,当时也不知道是什么意思,见的多了就想了

解一下。原来这个方法还是挺有用的,多用在编写插件,当然,它本身也有一些重载原型。

1 extend(result,item1,item2…..)

这里这个方法主要用来合并,将所有的参数项都合并result中,并返回result,但是这

样就会破坏result的结构。

2 extend({},item1,item2,……)

用这个方法,可以将所得的结果全部合并在{}中,并返回,而且还不会破坏原有的项的结构。

示例:

Var item={name:”olive”,age:23};

Var item1={name:”Momo”,sex:”gril”};

Var result=$.extend({},item,item1);

结果:

Result={name:”Momo”,age:23,sex:”gril”};

说明:

以上的结果表明extend方法将所有的项都合并到了{}中,但是,细心一点就会发现,其中item1中的name:“Momo” 将item中的name:“olive”给覆盖了,这是怎么回事?请接着往下看。

3 extend(bool,{},item1,item2….)

Extend方法还有带bool型参数的重载。

bool型参数为true表示深拷贝,为false时表示浅拷贝。具体可以通过一下示例来说明:

示例:

var item={name:“olive”,age:23,address{provice:”河南”,city:”郑州”}};

var item1={sex:”girl”,address{city:”北京”}};

var result=$.extend(true,item,item1);

var result1=$.extend(false,item,item1);

结果:

Result={name:“olive”,age:23,sex:”gril”,address:{provice:”河南”,city:”北京”}};

Result1={name:“olive”,age:23,sex:”gril”,address:{ city:”北京”}};

说明:

以上结果说明,当参数为ture时,即为深拷贝,当子项item1中的子项有与item中的子项相同属性的值不一样时,item1中子项的值会将item子项中的值给覆盖,当子项item1的属性跟item中的属性不同时,会与item进行合并。

当参数为false时,子项item1中的子项中与item中的子项属性相同时,item1中子项的属性值会将item中的值给完全覆盖。

4 $.extend(item)

该方法是将item合并到Jquery的全局对象中去,相当于为Jquery全局对象添加了一个

静态方法(对应这里的静态方法,当然还有实例方法,在后边有介绍)。

     示例:

           $.extend({SayHello:function(value){alert(“hello “+value);}});

           这样写过之后,就可以直接调用SayHello方法:

           $.SayHello(“Olive”);

     说明:该方法相当于为Jquery类添加了新的方法。

5 $.fn.extend(item)

上边提到的$.extend(item)说是为Jquery类添加了静态方法,那么这里的$.fn.extend(item

)就是为每一个实例添加一个实例方法了。

     示例:

         $.fn.extend({hello:function(value){alert(“hello “+value);}});

         这样写过之后,在获取每一个示例之后,都可以调用该方法:

         $(“#id”).hello(“Olive”);

 http://blog.csdn.net/xuemoyao/article/details/19021659

 

分享到:
评论

相关推荐

    jQuery中extends详解[借鉴].pdf

    在JavaScript的世界里,jQuery库提供了许多实用的工具函数,其中`jQuery.extend`就是一个非常重要的功能,用于对象的合并与扩展。本文将深入解析`jQuery.extend`的工作原理和应用场景。 首先,`jQuery.extend`的...

    React中jquery引用的实现方法

    class TestJquery extends React.Component { constructor(props) { super(props); this.selectElement = this.selectElement.bind(this); } render() { return ( 点击一下 这是:12 ); } select...

    JQUERY CODEIgniter

    class My_controller extends CI_Controller { public function my_function() { $data = $this->input->post('key'); // 处理数据 $response_data = array('result' => 'success'); echo json_encode($...

    jquery与servlet交互

    public class YourServlet extends HttpServlet { protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { String username = request....

    Jquery与struts2

    **jQuery与Struts2整合详解** 在Web开发中,jQuery是一个强大的JavaScript库,它极大地简化了JavaScript的使用,使得前端交互更加便捷高效。而Struts2作为一款成熟的MVC框架,广泛应用于Java后端开发,提供了强大的...

    struts2+jquery实现ajax

    Struts2和jQuery是两种非常流行的开源框架,它们在Web开发中有着广泛的应用。Struts2作为MVC(Model-View-Controller)架构的一部分,主要用于处理控制器层的逻辑,而jQuery则是一个强大的JavaScript库,简化了DOM...

    jquery validate配合struts2简单整改

    public class MyAction extends ActionSupport { private String username; private String email; @NotEmpty(message = "用户名不能为空") public String getUsername() { return username; } public void...

    jquery与struts2整合

    【jQuery与Struts2整合详解】 在Web开发中,jQuery是一个强大的JavaScript库,它简化了JavaScript的DOM操作、事件处理和Ajax交互。Struts2是一个流行的Java Web框架,用于构建MVC(Model-View-Controller)架构的...

    struts2+ajax+jquery

    <package name="default" namespace="/" extends="struts-default"> <result type="json">/success.jsp</result> <!-- JSON结果 --> ``` 这里的`MyAction`类会处理请求并设置模型数据,然后Struts2的JSON插件...

    struts2+jquery之form插件实现异步上传

    public class UploadAction extends ActionSupport { private File uploadFile; private String uploadFileContentType; private String uploadFileFileName; @Params("uploadFile") public void ...

    jquery实现页面之间的传值功能

    public class UserVerifyServlet extends HttpServlet { @Override protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { PrintWriter pw = resp....

    Java通过jQuery实现ajax异步请求

    public class DataServlet extends HttpServlet { protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // 实现业务逻辑 Map, Object> ...

    servlet+jquery实现文件上次进度条

    public class UploadServlet extends HttpServlet { protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { Part filePart = request....

    jquery的ajax传json对象数组到struts2的action

    在Web开发中,jQuery的AJAX功能经常被用于与服务器进行异步数据交换,而Struts2作为一款流行的Java Web框架,提供了处理前端请求的能力。本文将深入探讨如何使用jQuery的AJAX方法发送JSON对象数组到Struts2的Action...

    jquery uploadify java版

    public class FileUploadServlet extends HttpServlet { protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { String savePath = ...

    jQuery 文件上传

    public class FileUploadServlet extends HttpServlet { @Override protected void doPost(HttpServletRequest request) throws ServletException, IOException { Part filePart = request.getPart("file"); // ...

    Jquery progressbar通过Ajax请求获取后台进度演示

    public class ProgressAction extends ActionSupport { private int progress; public int getProgress() { // 更新进度并返回 return progress; } @Override public String execute() throws Exception {...

    Jquery 封装下的ajax异步加载

    public class MyServlet extends HttpServlet { protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType(...

Global site tag (gtag.js) - Google Analytics