选项卡3

<script>
window.onload=function ()
{
new TabSwitch('div1');
}; function TabSwitch(id) // TabSwitch 是 id 的 对象??
{
// var oDiv=document.getElementById('div1');
var oDiv=document.getElementById(id); this.aBtn=oDiv.getElementsByTagName('input'); // 变量 => 属性
this.aDiv=oDiv.getElementsByTagName('div');
//去除了全局变量 var aBtn = null; var aDiv = null;
// 把aBtn / aDiv 变成了 TabSwitch函数的 属性。 for(var i=0;i<this.aBtn.length;i++)
{
this.aBtn[i].index=i; this.aBtn[i].onclick = this.fnClick;
// fnClick 写成 this.fnClick
//(这里不再是函数了,是 TabSwitch的方法,所以要这样写)
}
}; //function fnClick(){}; => TabSwitch.prototype.fnClick=function (){};
// 函数 => 方法 TabSwitch.prototype.fnClick=function ()
// 给TabSwitch 添加 fnClick 这个方法
{
for(var i=0;i<this.aBtn.length;i++) // aBtn.length => this.aBtn.length
{
this.aBtn[i].className=''
this.aDiv[i].style.display='none';
}
oBtn.className='active';
this.aDiv[oBtn.index].style.display='block';
}
</script>

选项卡2

<script>
var aBtn=null; // 全局变量,window.onload 和 fnClick 都可以用
var aDiv=null; window.onload=function ()
{
var oDiv=document.getElementById('div1');
aBtn=oDiv.getElementsByTagName('input');
//这里获取变量的内容,能在下面fnClick函数里识别?? aDiv=oDiv.getElementsByTagName('div'); for(var i=0;i<aBtn.length;i++)
{
aBtn[i].index=i;
aBtn[i].onclick=fnClick;
}
}; function fnClick()
{
for(var i=0;i<aBtn.length;i++)
{
aBtn[i].className=''
aDiv[i].style.display='none';
}
this.className='active';
aDiv[this.index].style.display='block';
}
</script>

最新文章

  1. 【leetcode❤python】 125. Valid Palindrome
  2. Sublime+Golang Plugin
  3. RecyclerView的使用(一)
  4. ArcObject10.1降级至10.0
  5. JavaEE基础(三)
  6. UVa 514 (stack的使用) Rails
  7. 关于微软企业库中依赖注入容器Unity两种生成对象的实现u
  8. CCNA实验(8) -- PPP &amp; HDLC
  9. react基于nodejs简单的搭建与开发方法
  10. Python学习之二:Python 与 C 区别
  11. webpack-dev-server 设置反向代理解决跨域问题
  12. 安装USB驱动时报错“无法启动服务,原因可能是已被禁用或与其相关联的设备没有启动”
  13. 最长回文(manacher模板)
  14. 配置yum软件仓库(redhat 7.0)
  15. LINUX部署SVN服务器
  16. Docker Kubernetes(K8s)简介
  17. 不常见的javascript调试技巧
  18. tp5数据输出
  19. shutdown命令详解
  20. 生产环境手把手部署ERC20智能合约

热门文章

  1. ubuntu下vim中内容拷贝到浏览器
  2. Netty In Action中文版 - 第七章:编解码器Codec
  3. js插件---JS表格组件BootstrapTable行内编辑解决方案x-editable
  4. 计算器-- 利用re模块 利用函数封装 第二版
  5. 基于x86平台的Solaris安装视频(时长25分钟)
  6. Linux-swap分区
  7. 抓包神器Fiddler之Https请求随心转
  8. 用 OPENSSL 生成不同格式的密钥
  9. ubuntu-通配符
  10. worktools-不同分辨率下图片移植