IE 修复 - 条件注释脚本不会执行

Posted 2023-03-07

【中文标题】IE 修复 - 条件注释脚本不会执行

【英文标题】：IE Fixes - Conditional Comment Script will not execute

【发布时间】：2011-11-21 11:51:15

【问题描述】：

我正在尝试建立一个网站。除了 IE 8 及更低版本外，我在每个浏览器中都能正确显示它。 IE 在我的 img 周围呈现蓝色框，这些框也是锚点。我可以通过将border属性设置为none来摆脱这个，但我想用javascript来做。我可以让我的 Javascript 在条件注释中执行。

try

var ancs = document.getElementsByTagName("a");

    for(var i=0; i<ancs.length; i++)
    
        if(ancs[i].childNodes[0].nodeName == "IMG")
        
            //Set border property to none
        
    

catch(err)

alert(err);

【问题讨论】：

我认为你不能只通过 css 做img border-style:none;？

【参考方案1】：

我很抱歉没有回答 javascript 部分。但是您应该使用 CSS 像这样：

a img  border:0; 

【参考方案2】：

您的条件评论是什么样的？而且，为什么不把它作为一种风格来应用呢？它会比使用 JavaScript 更快并且得到更好的支持。

【参考方案3】：

IE 对自己没有指定的图像有一个默认的边框样式。这是 IE 的已知痛点。解决此问题的正确方法是向您的页面添加默认 CSS 规则。如果这是第一个 CSS 规则，那么它不会影响您已经设置的任何其他 CSS 规则：

<style type="text/css">
    img border: none;
</style>

或者如果你真的只想影响 <a> 标签中的图像，你可以使用这个 CSS：

<style type="text/css">
    a img border: none;
</style>

如果您只想修复/更改一张图片，您还可以通过指定内嵌边框在<img> 标签中处理该特定图片：

<img border="0" src="xxxx">

如果你真的想用 javascript 来做，你可以在页面加载之后放置这个代码，或者只在页面加载后调用它：

function nukeImageBorders() 
    // assumes all affected images have an <a> tag as their parent
    var list = document.getElementsByTagName("img");
    for (var i = 0, len = list.length; i < len; i++) 
        if (list[i].parentNode.tagName.toLowerCase() == "a") 
            list[i].style.border = "none";
        
    

你可以在这里看到代码在 IE 中的工作：http://jsfiddle.net/jfriend00/cnEhY/