javaScript NameSpace 简单说明介绍


Posted in Javascript onJuly 18, 2013

    打造JavaScript命名空间其实很简单,只需要将自己的函数、对象、变量等放在一个伪命名空间中,即用一个匿名函数包装起来。
 

(function(){ 
    function $(id){ 
        return document.getElementById(id); 
    } 
    function alertNodeName(id){ 
        alert($(id).nodeName); 
    } 
})();

    使用这种伪命名空间可以封装并保护自己的所有函数、对象、变量,而且由于他们位于一个函数之中,相互之间也可以互相访问。不过伪命名空间之外的脚本就无法使用这些函数了。
    为了使这些函数可以被伪命名空间之外的脚本调用,我们首先创建一个window对象。
(function(){ 
    if(!window.myNamespace){window['myNameSpace']={};} 
    function $(id){ 
        return document.getElementById(id); 
    } 
    function alertNodeName(id){ 
        alert($(id).nodeName); 
    } 
})();

    然后将要全局化的函数重命名一下(也可以不重命名)赋给window对象window['myNameSpace']。
(function(){ 
    if(!window.myNamespace){window['myNameSpace']={};} 
    function $(id){ 
        return document.getElementById(id); 
    } 
    function alertNodeName(id){ 
        alert($(id).nodeName); 
    } 
    window['myNameSpace']['showNodeName'] = alertNodeName; 
})();

    这样我们就打造了一个自己的命名空间。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<HTML> 
 <HEAD> 
  <TITLE> New Document </TITLE> 
  <META NAME="Generator" CONTENT="EditPlus"> 
  <META NAME="Author" CONTENT=""> 
  <META NAME="Keywords" CONTENT=""> 
  <META NAME="Description" CONTENT=""> 
  <SCRIPT LANGUAGE="JavaScript"> 
  <!-- 
 (function(){ 
  function $(id){ 
   return document.getElementById(id); 
  } 
  function alertNodeName(id){ 
   alert($(id).nodeName); 
  } 
  window['myNameSpace'] = {}; 
  window['myNameSpace']['showNodeName'] = alertNodeName; 
 })(); 
    function Test(){ 
  myNameSpace.showNodeName("T"); 
 } 
  //--> 
  </SCRIPT> 
 </HEAD> 
 <BODY onload="Test()"> 
   <INPUT TYPE="text" NAME="T" ID="T" VALUE="Test"> 
 </BODY> 
</HTML>
Javascript 相关文章推荐
图片之间的切换
Jun 26 Javascript
jquery 框架使用教程 AJAX篇
Oct 11 Javascript
被jQuery折腾得半死,揭秘为何jQuery为何在IE/Firefox下均无法使用
Jan 22 Javascript
JS俄罗斯方块,包含完整的设计理念
Dec 11 Javascript
jQuery '行 4954 错误: 不支持该属性或方法' 的问题解决方法
Jan 19 Javascript
JavaScript实现找出数组中最长的连续数字序列
Sep 03 Javascript
Bootstrap3.0建站教程(一)之bootstrap表单元素排版
Jun 01 Javascript
js插件Jcrop自定义截取图片功能
Oct 14 Javascript
小白教程|一小时上手最流行的前端框架vue(推荐)
Apr 10 Javascript
详解Vue.js中引入图片路径的几种方式
Jun 17 Javascript
微信小程序模板消息限制实现无限制主动推送的示例代码
Aug 27 Javascript
JavaScript实现简单计时器
Jun 22 Javascript
JS获取鼠标坐标的实例方法
Jul 18 #Javascript
非常好用的JsonToString 方法 简单实例
Jul 18 #Javascript
转义字符(\)对JavaScript中JSON.parse的影响概述
Jul 17 #Javascript
JS随机生成不重复数据的实例方法
Jul 17 #Javascript
Javascript和HTML5利用canvas构建Web五子棋游戏实现算法
Jul 17 #Javascript
javascript和HTML5利用canvas构建猜牌游戏实现算法
Jul 17 #Javascript
js中如何把字符串转化为对象、数组示例代码
Jul 17 #Javascript
You might like
JavaScript的Cookies
2008/01/16 Javascript
JavaScript 基础篇(一)
2012/03/30 Javascript
Extjs实现下拉菜单效果
2016/04/01 Javascript
jQuery验证插件validate使用详解
2016/05/11 Javascript
简单学习vue指令directive
2016/11/03 Javascript
node.js中的事件处理机制详解
2016/11/26 Javascript
javascript验证香港身份证的格式或真实性
2017/02/07 Javascript
Angular2中select用法之设置默认值与事件详解
2017/05/07 Javascript
详解如何在Angular中快速定位DOM元素
2017/05/17 Javascript
基于angular2 的 http服务封装的实例代码
2017/06/29 Javascript
js学习总结之DOM2兼容处理重复问题的解决方法
2017/07/27 Javascript
浅谈Angular4实现热加载开发旅程
2017/09/08 Javascript
JS随机排序数组实现方法分析
2017/10/11 Javascript
vue导出html、word和pdf的实现代码
2018/07/31 Javascript
jQuery实现轮播图及其原理详解
2020/04/12 jQuery
Vue路由守卫之路由独享守卫
2019/09/25 Javascript
浅谈layui里的上传控件问题
2019/09/26 Javascript
ES6新增的数组知识实例小结
2020/05/23 Javascript
js实现复制粘贴的两种方法
2020/12/04 Javascript
Python下线程之间的共享和释放示例
2015/05/04 Python
pandas.DataFrame.to_json按行转json的方法
2018/06/05 Python
对python 多线程中的守护线程与join的用法详解
2019/02/18 Python
Python-numpy实现灰度图像的分块和合并方式
2020/01/09 Python
丽笙酒店官方网站:Radisson Hotels
2019/05/07 全球购物
电子信息工程专业推荐信
2014/02/14 职场文书
团购业务员岗位职责
2014/03/15 职场文书
学校政风行风评议心得体会
2014/10/21 职场文书
2014个人年度工作总结
2014/12/15 职场文书
七年级地理教学计划
2015/01/22 职场文书
2015年六一儿童节演讲稿
2015/03/19 职场文书
联村联户简报
2015/07/21 职场文书
新娘婚礼致辞
2015/07/27 职场文书
小学校本教研总结
2015/08/13 职场文书
Nginx快速入门教程
2021/03/31 Servers
php 原生分页
2021/04/01 PHP
工厂无线对讲系统解决方案
2022/02/18 无线电