-第5章 多级菜单

知识点

使用 jquery 的 has() 选择包含指定后代的元素。

三级菜单

一般情况下，会做三级菜单，那么四级五级...就会做了。但是在实际应用中，有三级以上的级菜单是很少见的，因为那样对用户影响不好。

ie6 非 a 标签伪类兼容

方法一，使用 csshover.htc 文件
在 body 中引用它：

body{
behavior:url(csshover.htc);
}

方法二，针对 ie6 使用 js 的鼠标事件
判断出 ie 6 的 js:

var isIE=!!window.ActiveXObject;
var isIE6=isIE && !window.XMLHttpRequest;

吐嘈：
既然可以用鼠标事件，干嘛不全部用鼠标事件？
回答A：
我竟无言以对。
回答B：
不是说兼容吗？这就是兼容呀。
吐嘈：
我竟无言以对。

js 实现，完整代码

可能需要定义一下 dtd 。

• 
  一级菜单+
  
  
  
  • 
    二级菜单+
    
    
    
    • 三级菜单
    
    
    • 三级菜单
    
    
    • 三级菜单
    
    
  
  
  • 二级菜单
  
  
  
  


• 一级菜单

jq 实现，完整代码

• 
  一级菜单+
  
  
  
  • 
    二级菜单+
    
    
    
    • 三级菜单
    
    
    • 三级菜单
    
    
    • 三级菜单
    
    
  
  
  • 二级菜单
  
  
  
  


• 一级菜单

拓展 判断 ie6/7/8

var isIE = !!window.ActiveXObject;
var isIE6 = isIE && !window.XMLHttpRequest;
var isIE8 = isIE && !!document.documentMode;
var isIE7 = isIE && !isIE6 && !isIE8;
if (isIE) {
if (isIE6) {
alert("ie6");
} else if (isIE8) {
alert("ie8");
} else if (isIE7) {
alert("ie7");
}
}

仅6个字节判断 ie6/7/8

var isIE = !-[1,];

2010年1月，一位俄国人利用了IE与标准浏览器在处理数组的toString方法的差异，仅6bytes就完美完成了是否IE浏览器的检测。

注： !-[1,] 只能判断 ie6/7/8 ，不能判断 ie9 。

jq判断
在 jq1.8 之前可以使用以下 api 判断：

if($.browser.msie && $.browser.version.substr(0,1)<7){//ie6}

在 jq1.9 中：

if (!$.support.leadingWhitespace) {//IE8以下}

jq2.0 不支持 ie6/7/8 。