博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
使用jQuery封装实用函数
阅读量:7087 次
发布时间:2019-06-28

本文共 935 字,大约阅读时间需要 3 分钟。

一、引言

项目开发中,前端会有一个辅助工具类的js文件,比如cookie的操作,团队成员自己封装的方法。大多数时候,我们开发人员自己都是写一个全局函数,不考虑后期维护人员也会写相同的代码,然后造成代码之间的冲突。之前维护的一段代码如下:

 

var g=function(id){    return document.getElementById(id);};var $$=function(id){    return document.getElementById(id);};g("testdiv").style.color="red";$$("testdiv").innerHTML="this is a test.";

 

因为代码历史久远,也不知道是不是在jQuery出来之前写的呢,还是之后。开发者为了节省后面写document.getElementById()这个方法,在页面居然用了两个缩写去替代。$$应该后面的开发人员添加进去的,可能他觉得使用g来代替document.getElementById()不是很明显。这个也说明,在开发过程中,很多开发者为了去大规模修改别人的代码,我们喜欢在别人代码上添加内容,不想删除内容。这样项目是可以运行了,但是大量冗余代码也产生了,对后期的维护和重构非常的不利。以上只是举个实际项目中例子。

二、实例

后面引入jQuery之后,开发者大多数都喜欢用$来替代。到目前为止,我使用的第三方类库,基本上没有以$来定义的。所以基本上没有出现过$代表的不是jQuery对象。但是为了代码可维护性,并且在我们写代码中,使用的$是jQuery对象,我们需要安全进行编写函数。因为有时项目的名字不同,我们还会使用命名空间才区分它们。

(function($){    $.say=function(what){        alert("I say "+what);    }})(jQuery);

这里我们将jQuery对象传入到函数中,以确保我们在函数内部使用的$是jQuery对象。

三、一个复杂的示例

标签: , ,

转载于:https://www.cnblogs.com/liminjun88/p/3933088.html

你可能感兴趣的文章
mach_absolute_time
查看>>
Android开发入门教程--4.用户界面之Layout(一)
查看>>
WordPress翻译中 __()、_e()、_x、_ex 和 _n 的用法及区别
查看>>
小黑小波比.根据数据加载的字段的值来显示指定<p></p>等控件
查看>>
cronatab周期性任务定时计划器
查看>>
使用Xcode上传代码至GitHub
查看>>
idea改造普通引用jar包项目为maven管理jar包项目
查看>>
如果你也会C#,那不妨了解下F#(4):了解函数及常用函数
查看>>
listview隔行背景背景设置
查看>>
使用TortoiseSVN进行分支管理
查看>>
Accessing a File (Linux Kernel)
查看>>
测试内存字节对齐代码
查看>>
计算机编程语言选择的困惑
查看>>
JavaScript事件
查看>>
Spring中BeanFactory的两大步骤
查看>>
elipse 插件初了解---扩展的加载过程
查看>>
JAVA帮助文档全系列 JDK1.5 JDK1.6 JDK1.7 官方中英完整版下载
查看>>
split-brain 脑裂问题(Keepalived)
查看>>
Mule ESB中entry-point-resolver的使用(2) Callable Entry Point Resolver
查看>>
mysql (master/slave)复制原理及配置
查看>>