msn上的tab功能Firefox对childNodes处理的一个BUG

Firefox对childNodes处理的一个BUG     
childNodesFirefox在处理childNodes没有过滤换行与空格。所以在初次使用的时候,得到效果不是预期的效果。
HTML


代码如下:

<ul class="tbtn" ID="menuList">
<li class="curr" id="tabap3_btn_0" onclick="tabit(this)">理财大学B</li>
<li id="tabap3_btn_1" onclick="tabit(this)">名医讲堂</li>
<li id="tabap3_btn_2" onclick="tabit(this)">名医讲堂</li>
<li id="tabap3_btn_3" onclick="tabit(this)">名医讲堂</li>
<li class="lst" id="tabap3_btn_4" onclick="tabit(this)">影坛热点</li>
</ul>

JS


代码如下:

function tabit(btn)
  {
    var idname = new String(btn.id);
    var s = idname.indexOf("_");
    var e = idname.lastIndexOf("_")+1;
    var tabName = idname.substr(0, s);
    var id = parseInt(idname.substr(e, 1));
    var tabNumber = btn.parentNode.childNodes.length;    //IE和FF的值不同    
    for(i=0;i<tabNumber;i++)
      {
        if(document.getElementById(tabName+"_div_"+i)!=null)    //这里需要进行判断
          {
        document.getElementById(tabName+"_div_"+i).style.display = "none";
        document.getElementById(tabName+"_btn_"+i).style.backgroundImage = "url(pic/t-1-2.gif)";
        document.getElementById(tabName+"_btn_"+i).style.borderBottomColor = "#D7F2DA";
        document.getElementById(tabName+"_btn_"+i).style.cursor = "pointer";
        }
    }
    document.getElementById(tabName+"_div_"+id).style.display = "block";
    btn.style.backgroundColor = "#fff";
    btn.style.borderBottomColor = "#fff";
    btn.style.cursor = "default";
}

在IE上menuList的childNodes.length的值为5,而在Firefox值为11.因此我们在使用childNodes对象时需要先对其判断或去掉空格。

(0)

相关推荐

  • msn上的tab功能Firefox对childNodes处理的一个BUG

    Firefox对childNodes处理的一个BUG      childNodesFirefox在处理childNodes没有过滤换行与空格.所以在初次使用的时候,得到效果不是预期的效果. HTML 复制代码 代码如下: <ul class="tbtn" ID="menuList"> <li class="curr" id="tabap3_btn_0" onclick="tabit(this)&q

  • Python调用百度AI实现图片上表格识别功能

    目录 简介 步骤 安装百度AI库 注册百度AI开放平台 调用AipOcr库识别表格文字 可能遇到的问题 批量操作 总结 简介 Python免费调用百度AI实现图片上面的表格识别 步骤 安装百度AI库 !pip install baidu-aip 注册百度AI开放平台 先注册百度AI,获得ID和密钥.注册方法可参考:注册方法 只需走到 "1.6 获取密钥" 即可.然后记录下自己的APP_ID.API_KEY.SECRET_KEY,就可以开始了. 调用AipOcr库识别表格文字 from

  • java中struts2实现文件上传下载功能实例解析

    本文实例讲述了java中struts2实现文件上传下载功能实现方法.分享给大家供大家参考.具体分析如下: 1.文件上传 首先是jsp页面的代码 在jsp页面中定义一个上传标签 复制代码 代码如下: <tr>      <td align="right" bgcolor="#F5F8F9"><b>附件:</b></td>      <td bgcolor="#FFFFFF">

  • Java 发送http请求上传文件功能实例

    废话不多说了,直接给大家贴代码了,具体代码如下所示: package wxapi.WxHelper; import java.io.BufferedReader; import java.io.DataInputStream; import java.io.DataOutputStream; import java.io.File; import java.io.FileInputStream; import java.io.IOException; import java.io.InputSt

  • jQuery实现MSN中文网滑动Tab菜单效果代码

    本文实例讲述了jQuery实现MSN中文网滑动Tab菜单效果代码.分享给大家供大家参考.具体如下: 这是一款jQuery实现Msn中文网的滑动滑动门代码,利用jQuery实现的效果,代码很巧妙,就是利用一个绝对定位的层来实现移动效果,但是体验度大幅提升了. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/jquery-f-msn-tab-menu-style-codes/ 具体代码如下: <!DOCTYPE html> <html>

  • Python实现鼠标自动在屏幕上随机移动功能

    本来想控制鼠标自动移动防止公司电脑自动休眠的策略,然而,实现了并没什么卵用,还是会休眠.但还是分享出来吧.win10的系统. 首先要安装几个第三方的包:pymouse.pyhook.pywin32.pyuserinput.别看代码里值引用pymouse和win32api,如果不把这些都装了,运行时就会报错. 下面来看下代码吧. from pymouse import PyMouse from win32api import GetSystemMetrics import random impor

  • 表单正则验证及文件上传验证功能

    表单正则验证主要是用来对表单提交信息的过滤,防止sql注入(比如登录界面),上传的文件也需要进行文件名后缀和大小进行验证,下面是一个简单的表单验证 header("Content-type:text/html;charset=utf-8"); $user = isset($_POST['user'])?$_POST['user']:null; $password = isset($_POST['password'])?$_POST['password']:null; $arr = ar

  • JavaWeb实现文件上传下载功能实例解析

    在Web应用系统开发中,文件上传和下载功能是非常常用的功能,今天来讲一下JavaWeb中的文件上传和下载功能的实现. 对于文件上传,浏览器在上传的过程中是将文件以流的形式提交到服务器端的,如果直接使用Servlet获取上传文件的输入流然后再解析里面的请求参数是比较麻烦,所以一般选择采用apache的开源工具common-fileupload这个文件上传组件.这个common-fileupload上传组件的jar包可以去apache官网上面下载,也可以在struts的lib文件夹下面找到,stru

  • ajax实现无刷新上传文件功能

    本文实例为大家分享了ajax实现无刷新上传文件功能的具体代码,供大家参考,具体内容如下 详细代码如下 <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>ajax无刷新上传文件</title> <script> window.o

  • hadoop上传文件功能实例代码

    hdfs上的文件是手动执行命令从本地linux上传至hdfs的.在真实的运行环境中,我们不可能每次手动执行命令上传的,这样太过繁琐.那么,我们可以使用hdfs提供的Java api实现文件上传至hdfs,或者直接从ftp上传至hdfs. 然而,需要说明一点,之前笔者是要运行MR,都需要每次手动执行yarn jar,在实际的环境中也不可能每次手动执行.像我们公司是使用了索答的调度平台/任务监控平台,可以定时的以工作流执行我们的程序,包括普通java程序和MR.其实,这个调度平台就是使用了quart

随机推荐