自建JavaScript函数库

最新推荐文章于 2023-05-28 00:24:38 发布

「已注销」

最新推荐文章于 2023-05-28 00:24:38 发布

阅读量2.9k

点赞数 6

本文链接：https://blog.csdn.net/lidatgb/article/details/7680622

版权

前段时间学JavaScript，最先学的就是如何建立自己的JavaScript函数库，在我看来，函数就是程序活的灵魂，在此简单介绍一下如何建立自己的JavaScript函数库。

原则：

不要版本检测：常用浏览器一般是IE、firefox、safari、opera、google，不能为了追求兼容而嗅探当前浏览器进而选择运行模式。

最好是能力检测：即在代码执行之前，检测使用的某个脚本或是对象是否存在，而不是依赖于哪种浏览器，例如：

             if (document.body&&document.body.getElementsByTagName) {//如果document.body 与getElementsByTagName存在
                     //使用document.body.getElementsByTagName代码
             }

使用命名空间：javascript支持多次声明同名函数，但是只能使用最后声明的版本，为了确保不相抵触，需要使用命名空间来区别同名函数。使用命名空间分需要注意两点：唯一和不共享，唯一即命名空间命名唯一，例如google加G，我自己的加LD；不共享即什么都不共享包括名称、变量等，为了防止自己的$函数和prototype中的冲突，可以使用如下方法：

(function(){
    //自己的代码
})();

Javascript函数库

自建函数库模型：

// JavaScript Document
(function(){
		  function $(){
			  alert ("正在Buffering！");//提示正在缓冲
			  }
			  window['LD']={}//把LD命名空间加到window
			  window['LD']['$']=$;把$函数加到LD
}
)();

JavaScript函数库实例

(function () {
        window['LD'] = {}; //将命名空间写到window上
        function $() {//获取elements
                var elements = new Array();
                for (var i = 0; i < arguments.length; i++) {
                        var element = arguments[i]; //赋值element参数数组值 
                        if (typeof element == 'string') {
                                element = document.getElementById(element);
                        }
                        if (arguments.length == 1) {
                                return element;
                        }
                        elements.push(element);
                }
                return elements;
        };
        function getElementsByClassName() {
                //TODO
        };
        window['LD']['$'] = $; //将函数写到window下的LD下
        window['LD']['getElementsByClassName'] = getElementsByClassName; //将新的getElementsByClassName添加到LD下
})()

head：

<head>
        <script src="LD.js" type="text/javascript"></script>
        <script type="text/javascript">
                function cclick() {
                        var testInput = LD.$("Text1", "Text2");
                        for (var i = 0; i < testInput.length; i++) {
                                alert(testInput[i].value);//弹出其内容
                        }
                }
          </script>
<title></title>
</head>

body：

<body onload ="LD.$();">
        <p>
                <input id="Text2" type="text" value="廊坊" />
                <input id="Text1" type="text"  value="提高班" />
        </p>
        <p>
                <input id="Button1" type="button" value="点我"  οnclick="cclick();" />
        </p>
</body>

运行结果：

这只是最基本的自建函数库，更多的自建函数还等待我的积累。

「已注销」

关注

6
点赞
踩
1

收藏

觉得还不错? 一键收藏
14
评论
自建JavaScript函数库

前段时间学JavaScript，最先学的就是如何建立自己的JavaScript函数库，在我看来，函数就是程序活的灵魂，在此简单介绍一下如何建立自己的JavaScript函数库。原则：不要版本检测：常用浏览器一般是IE、firefox、safari、opera、google，不能为了追求兼容而嗅探当前浏览器进而选择运行模式。最好是能力检测：即在代码执行之前
复制链接

扫一扫