javascript - HTML 中是否可以使 IE 更宽容标记错误(例如无关标签)?

标签 javascript jquery html internet-explorer jquery-ui-tabs

我定义了一个 jQuery 选项卡元素,如下所示:

    <div id="tabs">
        <ul>
            <li><a href="#tabs-1">Nunc tincidunt</a></li>
            <li><a href="#tabs-2">Proin dolor</a></li>
            <li><a href="#tabs-3">Aenean lacinia</a></li>
        </ul>
        <div id="tabs-1">
            <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus.</p>
        </div>
        <div id="tabs-2">
            <p>Morbi tincidunt, dui sit amet facilisis feugiat, odio metus gravida ante, ut pharetra massa metus id nunc. Duis scelerisque molestie turpis. Sed fringilla, massa eget luctus malesuada, metus eros molestie lectus, ut tempus eros massa ut dolor. Aenean aliquet fringilla sem. Suspendisse sed ligula in ligula suscipit aliquam. Praesent in eros vestibulum mi adipiscing adipiscing. Morbi facilisis. Curabitur ornare consequat nunc. Aenean vel metus. Ut posuere viverra nulla. Aliquam erat volutpat. Pellentesque convallis. Maecenas feugiat, tellus pellentesque pretium posuere, felis lorem euismod felis, eu ornare leo nisi vel felis. Mauris consectetur tortor et purus.</p>
        </div>
        <div id="tabs-3">
            <p>Mauris eleifend est et turpis. Duis id erat. Suspendisse potenti. Aliquam vulputate, pede vel vehicula accumsan, mi neque rutrum erat, eu congue orci lorem eget lorem. Vestibulum non ante. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Fusce sodales. Quisque eu urna vel enim commodo pellentesque. Praesent eu risus hendrerit ligula tempus pretium. Curabitur lorem enim, pretium nec, feugiat nec, luctus a, lacus.</p>
            <p>Duis cursus. Maecenas ligula eros, blandit nec, pharetra at, semper at, magna. Nullam ac lacus. Nulla facilisi. Praesent viverra justo vitae neque. Praesent blandit adipiscing velit. Suspendisse potenti. Donec mattis, pede vel pharetra blandit, magna ligula faucibus eros, id euismod lacus dolor eget odio. Nam scelerisque. Donec non libero sed nulla mattis commodo. Ut sagittis. Donec nisi lectus, feugiat porttitor, tempor ac, tempor vitae, pede. Aenean vehicula velit eu tellus interdum rutrum. Maecenas commodo. Pellentesque nec elit. Fusce in lacus. Vivamus a libero vitae lectus hendrerit hendrerit.</p>
        </div>
    </div>
</div> <!-- OOPS! EXTRANEOUS DIV TAG! -->

<script>
    $(function() {
        $( "#tabs" ).tabs();
    });
</script>

它可以在 Chrome 和 Firefox 中运行,但不能在 IE 中运行

但后来我注意到一个无关紧要的结束语 </div>标记在此标记的末尾。

删除它后,选项卡在 IE 中正确显示。

是否有可能使 IE 对此类微不足道的标记错误不太敏感?

这是我正在使用的文档类型:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"> 

最佳答案

Is it possible to make IE less sensitive to trivial markup mistakes like this?

不,不是,输出有效标记。更重要的是拥有 XHTML 1.0 Strict作为您的 DOCTYPE,您告诉浏览器“这是完美的”,它是您可以拥有的 3 个最严格的标记 DOCTYPE 之一。

大多数情况下,IE 无法呈现 100% 有效的页面,它当然不会容忍大多数无效的页面...修复标记是迄今为止最好的选择,而不是试图让浏览器应对它。毕竟控制了您的标记,但您无法控制浏览器(或它可能获得的任何更新......或用户使用的浏览器)。通过使用有效的标记,您已经迈出了最好的第一步,确保它在浏览器之间呈现得尽可能接近。

这样想,你就“哎呀”</div>标签...你会做什么?其中<div>应该关闭吗?您希望浏览器尝试一下,可能会渲染一个格式非常不正确的页面?它无法知道您的意图,它只知道收到的标记。

关于javascript - HTML 中是否可以使 IE 更宽容标记错误(例如无关标签)?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4323220/

相关文章:

css - html5 标签或 float 属性无法正常工作

javascript - 当 Bootstrap 中触发两个模态时,如何关闭其中一个模态

javascript - 使用自定义链接单击传单 map 中的 openPopup()

javascript - HTML5/JS 和 websockets 中的实时协作绘图白板?

html - 如何在没有实际 Retina 显示屏的情况下在 Windows 上测试 Retina 网站?

javascript - 从文件夹加载图像时 Ajax 调用抛出 404

asp.net - 获取网站根目录的基本 url(绝对/相对 url)

javascript - 一个 "fixed"<div>-Tag (Footer) resize height of another

javascript - 为数组中的每个项目运行 Node 端点?

javascript - JQuery toggle() 在 1.9.1 中不起作用