jquery 自定义插件

最新推荐文章于 2022-03-23 14:15:31 发布

王翼鹏

最新推荐文章于 2022-03-23 14:15:31 发布

阅读量130

点赞数

分类专栏： JavaScript html 文章标签： jquery js javascript html web

本文链接：https://blog.csdn.net/zghnpdswyp/article/details/116169160

版权

JavaScript 同时被 2 个专栏收录

25 篇文章 0 订阅

订阅专栏

html

12 篇文章 0 订阅

订阅专栏

定义插件：

//插件编写
;(function ($) {
    $.fn.myO = function () {
        
        var tt = "aaa";  //内部变量，外部不可以调用
        var haa = function () {
            alert("haa");
        } //内部方法，外部不可以调用
        this.test = function () {
            alert(tt);
            change();
            alert(tt);
        } //对外暴露的方法，外部可以调用
        function change() {
            tt = "444";
        }//对外暴露的方法，外部可以调用
        alert(tt);
        tt = "sss";
        this.append("<input type='button'/>");
        return this;


    }
})(jQuery);

调用：


<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
    <script type="text/javascript" src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
    <script type="text/javascript" src="~/scripts/jquery.myplugin.js"></script>

    
    <script type="text/javascript">

        $(document).ready(function () {
            var it = $("#preview").myO();
            it.test(); //对外暴露的方法，外部可以调用
            it.haa(); //内部方法，外部不可以调用
            it.tt; //内部变量，外部不可以调用
            it.change(); //对外暴露的方法，外部可以调用
        });
    </script>
</head>
<body>

    <div id="preview">

    </div>
   
</body>
</html>

王翼鹏

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jquery 自定义插件

定义插件：//插件编写;(function ($) { $.fn.myO = function () { var tt = "aaa"; this.test = function () { alert(tt); change(); alert(tt); } function change() { tt = "444";
复制链接

扫一扫