"噢,啪!" 检查Chrome中的元素时出错

12 html error-handling google-chrome

每当我检查导航菜单中的任何元素,或者检查元素然后浏览到导航菜单时,我会在Google Chrome中收到"Aw,Snap"错误.我认为源必须有问题,但在编辑器中查看源代码后,似乎一切都是正确的格式.

可能导致此错误的原因是什么?

你可以点击这里查看网站:)

更新:

此代码中的某些内容导致错误:

<li>
    <a id="nav-corporate" class="accordionButton <?php if (is_page(1635) || is_page(1909)) { echo "curr-page-nav";}?>">Corporate</a>
<div class="sub-list-container">

    <ul>
        <li>
            <a href="<?php echo get_page_link(1635); ?>" id="nav-meeting" class="subitem"><span class="nav-hidden">Meetings</span></a>
        </li>
        <li>
            <a href="<?php echo get_page_link(1909); ?>" id="nav-event" class="subitem"><span class="nav-hidden">Events</span></a>
        </li>
    </ul>
    </div>
    </li>
Run Code Online (Sandbox Code Playgroud)

顺便说一下,我试过三台电脑.

sal*_*uce 6

问题似乎是style.css文件的问题.在该文件中,您有:

/*::selection {
    background: #666; /* Safari */
    color: #FFF;
}

::-moz-selection {
    background: #666; /* Firefox */
    color: #FFF;
}*/
Run Code Online (Sandbox Code Playgroud)

发生的事情是你/* Safari */在上面的整个片段的更广泛的评论中有一个评论,这是过早地关闭更广泛的评论并导致CSS的解析错误.谷歌浏览器对格式错误的CSS文件感到窒息,导致"喔喔!" 检查元素时发生错误.

删除/* Safari */评论不会解决该问题,因为/* Firefox */下面会导致相同的问题.

编辑:虽然这确实解决了CSS的一个小问题,但它不是整个解决方案.根据下面的thakis回答,修复以下样式可以防止在检查元素时发生崩溃:

#navigation-menu-container{
  border-image:  url(images/shadow-border.png) 10 stretch;
}
Run Code Online (Sandbox Code Playgroud)

比较这个小提琴,它是有问题的网站代码(所有head标签和相关的html标记)的复制/粘贴,带有更正的小提琴,其中style.css标记已导入小提琴并且#navigation-menu-container规则已更改为上述代码,你会看到小提琴页面不会崩溃.

  • 这不是JavaScript,因为在禁用JavaScript后仍然会发生错误. (2认同)