JavaScript函数封装调用

最新推荐文章于 2025-06-15 13:50:13 发布

敲代码挣彩礼

最新推荐文章于 2025-06-15 13:50:13 发布

阅读量4.6k

点赞数 1

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/qq_37625156/article/details/94921987

本文探讨了前端开发中常见的封装方法，包括直接在页面中定义和调用函数，以及使用更高级的封装方式，如将功能封装为jQuery插件，提高代码复用性和维护性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

举个列子：我们在写前端页面，经常会使用到Jquery文本框内容，来判断一下输入值是否符合，常见的写法：

<script>
function test(){
$("#ID").click(){XXXXX};
}
</script>

这个页面写了个方法，结果发现另外一个页面还要写同样的，于是，就会写到js中

引入，调用

function test(){
XXXXX
}



页面调用
<sctipt>
test()


</sctipt>
这也是一种封装，
还有一种封装方法是
test= function(){
XXX
}
然后页面调用
test()

现在，我换种封装方法，类似封装成Jquery的(封装方法是多样的，国外大佬做的都很nb)

下面是国外大佬做的：

+function ($) {

let Judge = (function () {
let _divsuccess ='has-succes';
let span_succes = 'glyphicon-ok';
let _diverror = 'has-error';
let span_type = 'glyphicon-remove';
let Success = function (_class) {
$("." + _class).addClass(_divsuccess).removeClass(_diverror);
$("." + _class + " span").addClass(span_succes).removeClass(span_type);
}
let Error = function (_class) {
$("." + _class).addClass(_diverror).removeClass(_divsuccess);
$("." + _class + " span").addClass(span_type).removeClass(span_succes);

}
return {
Success,
Error
}

})();