脚本工作取决于IE文档模式

Question

我正在尝试用JavaScript编写一个小部件(使用UWA语法).它在FireFox中运行得非常好,但Internet Explorer却很奇怪.

基本上,当我第一次加载小部件时,它不会显示我的中心列(它应显示当天的Duty Rota).

但是,如果我按F12并进入开发者控制台,我可以将文档模式更改为IE9 standards并使其正常工作.

如果我然后将文档模式设置为Quirks,它显示如下:

定义中心列的代码如下:

/* [centre] Duty rota */
AllInOne.centreCol = function() {
    var now = new Date();
    var currentDay = now.getDay();

    var DRWeek1 = {
        Monday : {
            BeforeSchool : "HA, MJO, LS, GB, JSA, HA, TD",
            Breaks : "ABO, LL, RR, DR, PHd, JA, VID, AN, LDE, CN, DW, PG, MD, ND, CK, JP, RH, RJ, CC, GB",
            AfterSchool : "GB, CL, MVW, TD/GDO, HL, LS"
        },
        Tuesday : {
            BeforeSchool : "RJ, AN, AS, GB, JSA, SUW, MJO",
            Breaks : "DW, AB, RR, SDI, PHd, LL, ABO, ND, CG, CC, MD, PD, CT, RY, LDE, SC, RH, JR, RC, GB",
            AfterSchool : "GB, CL, MJO, TD/GDO, SUW, AS"
        },
        Wednesday : {
            BeforeSchool : "JP, JC, SM, GB, HSA, HA, CL",
            Breaks : "BW, JR, TG, SD, PHd, JM, SW, MVW, CG, AMO, MDA, KL, VID, CN, SDI, DST, VY, SLH, JH, GB",
            AfterSchool : "GB, MJO, CL, TD/GDO, HA, SM"
        },
        Thursday : {
            BeforeSchool : "SUW, HL, ST, GB, JSA, HL, CK",
            Breaks : "DR, VY, HL, CK, PHd, JC, DST, HS, SC, MDA, AH, PD, NB, AMO, HSM, DM, JOS, SLH, CK, GB",
            AfterSchool : "GB, JOR, JH, TD/GDO, HL, ST"
        },
        Friday : {
            BeforeSchool : "TG, SUW, JT, GB, JSA, JM, JP",
            Breaks : "SW, AB, HSM, HA, PHd, DM, JOS, CT, KL, BW, RY, PG, JA, NB, RC, HS, JOR, AH, GP, GB",
            AfterSchool : "GB, SWA, JM, TD/GDO, JP, JT"
        }
    }

    var DRHTML = '<h2>Duty Rota</h2>';

    switch ( currentDay ) {
        case 1:
            DRHTML += '<p><strong>Before School:</strong>' + DRWeek1.Monday.BeforeSchool + '</p>';
            DRHTML += '<p><strong>Break / Lunch:</strong>' + DRWeek1.Monday.Breaks + '</p>';
            DRHTML += '<p><strong>After School:</strong>' + DRWeek1.Monday.AfterSchool + '</p>';
            break;
        case 2:
            DRHTML += '<p><strong>Before School:</strong>' + DRWeek1.Tuesday.BeforeSchool + '</p>';
            DRHTML += '<p><strong>Break / Lunch:</strong>' + DRWeek1.Tuesday.Breaks + '</p>';
            DRHTML += '<p><strong>After School:</strong>' + DRWeek1.Tuesday.AfterSchool + '</p>';
            break;
        case 3:
            DRHTML += '<p><strong>Before School:</strong>' + DRWeek1.Wednesday.BeforeSchool + '</p>';
            DRHTML += '<p><strong>Break / Lunch:</strong>' + DRWeek1.Wednesday.Breaks + '</p>';
            DRHTML += '<p><strong>After School:</strong>' + DRWeek1.Wednesday.AfterSchool + '</p>';
            break;
        case 4:
            DRHTML += '<p><strong>Before School:</strong>' + DRWeek1.Thursday.BeforeSchool + '</p>';
            DRHTML += '<p><strong>Break / Lunch:</strong>' + DRWeek1.Thursday.Breaks + '</p>';
            DRHTML += '<p><strong>After School:</strong>' + DRWeek1.Thursday.AfterSchool + '</p>';
            break;
        case 5:
            DRHTML += '<p><strong>Before School:</strong>' + DRWeek1.Friday.BeforeSchool + '</p>';
            DRHTML += '<p><strong>Break / Lunch:</strong>' + DRWeek1.Friday.Breaks + '</p>';
            DRHTML += '<p><strong>After School:</strong>' + DRWeek1.Friday.AfterSchool + '</p>';
            break;
        default:
            DRHTML += '<p>No school. Yay!</p>';
            break;
    }

    var DutyRota = widget.createElement( 'p', 
        { 'id' : 'DR', 'class' : 'DR' } );
    widget.body.getElementsByClassName('centre_col')[0].appendChild(DutyRota);
    widget.body.getElementsByClassName('DR')[0].setHTML(DRHTML);
}

Internet Explorer不喜欢该功能中的某些内容吗？

我非常困惑,任何帮助将不胜感激.

---

编辑:完整的代码

可以在这里找到:http://pastebin.com/n1qFeTnU

---

附加编辑:看起来Widget容器正在强制页面进入IE9怪癖模式.因此,这意味着我根本无法控制文档模式.

所以,问题仍然存在,在我的代码中,IE9(浏览器模式)Quirks(doc模式)中的Internet Explorer不喜欢什么？

Answer 1

这是一个提示,不要使用Quirks模式.它呈现为IE5.5,这甚至比IE6更糟糕......

尝试将此标记添加到您的文件中:

<meta http-equiv="X-UA-Compatible" content="IE=edge" />