我有一个使用jQuery，bootstrap和2个不同jQuery插件的网页。一个称为Turn.js，另一个称为mCustomScrollbar。在今天之前，我有一个服务器端代码，它会在<!DOCTYPE html>标记之前为每个请求添加一个脚本标记。我注意到在另一个页面上，这导致了jQuery在使用$(window).height()时返回不正确的高度的问题，因此我修改了代码并想出了一种方法来在结束</body>之前放置脚本标记标签。但这会破坏我正在使用的mCustomScrollBar库的功能
由于某种原因滚动条未显示，鼠标滚轮功能被禁用，并且在移动/触摸设备上禁用了滚动功能。该插件肯定会被解雇，因为我可以看到插件修改了html。
所以我的问题是：当我有不正确的HTML时，为什么我的javascript正常工作，或者至少我想要它，但是当我的标记得到纠正时它无法正常工作（{{1}之前没有文字标签）？
相关守则：
我正在应用mCustomScrollbar插件的html结构。 <!DOCTYPE html> div的父级是一个引导程序#flip-indes，它是页面主容器。我在我的视图中使用带有razor语法的C＃。如果需要，我可以发布生成的页面html。
.container-fluid我的<div id="flip-index">
<div class="customScrollbar">
@for (var i = 0; i < Model.Pages.Count; ++i)
{
<div class="index-item" onclick="$('#flipbook').turn('page', @(i + 1));">
<img src="@Config.Get("FlipbookImgURL")@Model.Pages[i].Replace('\\', '/')" alt="Flipbook index preview" onerror="replaceWithText(event);"/>
<a class="btn btn-primary full-size-img" href="/FlipBook/FullSizeImage?img=@Config.Get("FlipbookImgURL")@Model.Pages[i].Replace('\\', '/')" target="_blank" title="View Image Full Size">
<span class="glyphicon glyphicon-eye-open"></span>
</a>
<div class="index-number">@(i + 1)</div>
</div>
}
<div class="index-pad"> </div>
</div>
</div>
$(document).ready()我在这个页面上有更多的js，但没有一个引用mCustomScrollbar插件，所以我认为它不相关，我不想让任何人有不必要的信息。如果有人想要发布更多代码，我很乐意这样做，只需要问。
我真的认为答案将取决于浏览器如何根据浏览器是否能够验证html来解释我的js或html标记。
答案 0 :(得分：1)
欢迎来到： QUIRKS MODE
根据doctype或缺少{{1}}，浏览器可以使用标准模式或怪癖模式。 Quirks模式复制了古代浏览器的功能，最好避免使用。
由于您在 doctype标记之前呈现内容，因此浏览器会假定怪癖。
这两种模式之间存在 LOT 差异，但这可能会让您开始：
https://developer.mozilla.org/en-US/docs/Quirks_Mode_and_Standards_Mode
以及这张友好的图表：
http://www.quirksmode.org/css/quirksmode.html
建议：不惜一切代价避免怪异模式。修复任何破坏的代码都会给你带来糟糕的HTML。