【JQuery】JQuery封装的小例子

最新推荐文章于 2022-11-23 23:21:52 发布

你个佬六

最新推荐文章于 2022-11-23 23:21:52 发布

阅读量2.6k

点赞数

文章标签： jquery 函数 html 库 javascript

本文链接：https://blog.csdn.net/kisscatforever/article/details/57131073

版权

➤ B/S起步篇同时被 2 个专栏收录

20 篇文章 0 订阅

订阅专栏

------【JQuery】

9 篇文章 0 订阅

订阅专栏

一、前言

JQuery是一个JS函数库，可以简单标记被添加到网页中。这个js库封装了各种选择器，可以捕获我们使用的html页面的节点。然后对html进行操作。

二、封装是什么

我们可以通过封装一些我们常用的方法或者模块，来提高我们自己的手法，提高我们自己的提高效果，所以我们就需要可以提高我们的效率，这样我们就是可以把更好的分析一下。

三、封装方法小例子

index.html

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <script src="js/jquery-1.7.1.min.js" ></script>

    <script src="js/saygoodbye.js"></script>
    <body>
        <input type="button" value="点击" onclick="jQuery.saygoodbye()" />
    </body>
</html>

saygoodbye.js

这里小编提供两种方法

方法一：这种方法也是可以达到效果的，但是用户喜欢用的$符号去哪里了？可以看看方法二来学习一下。

jQuery.saygoodbye = function(){
    alert("Good bye");
    $("body").hide();
}

方法二：我们定义一个匿名函数，并且闭包，出入一个JQuery参数进去，就完成了jquery的定义。

;(function($){
$.saygoodbye = function(){
    alert("Good bye");
    $("body").hide();
};
})(jQuery)

TIP

我们一般在写一个公共方法时会在前面定义一个“；”，在网上看到有人说这是书写的习惯，其实这是一个容错机制，有点sql中GO的意思，就是把上面的代码跟自己的这个拓展插件给分开，因为插件是被引入到页面，如果这个插件上面有错误，且别人忘记以“；”结尾，那么我们写的这个函数或者插件就会收到影响，所以要加上一个分号；

借鉴博客：

四、小结

其实这个思想还是很不错的，学习过程中每每要对自己的思考进行分析，梳理。加油！另外我们发现JQuery中有很多的东西都要进行自己的开发，面向对象的开发方式。

你个佬六

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
打赏
14
评论
【JQuery】JQuery封装的小例子

一、前言 JQuery是一个JS函数库，可以简单标记被添加到网页中。这个js库封装了各种选择器，可以捕获我们使用的html页面的节点。然后对html进行操作。二、封装是什么我们可以通过封装一些我们常用的方法或者模块，来提高我们自己的手法，提高我们自己的提高效果，所以我们就需要可以提高我们的效率，这样我们就是可以把更好的分析一下。三、封装方法小例子index.html<!DOCT
复制链接

扫一扫