Javascript JQuery只在兼容模式下工作

我正在创建一个将显示在本地intranet站点上的web应用程序
NB我正在使用IE11
它从

XML

文件中获取信息并循环浏览，依次显示每个部分。 为了在运行JQuery的系统上运行它，我不得不使用旧版本的JQuery，所以我使用的是

1.12.4

。 我的问题是，页面在第一个实例中提取信息，但在那之后它什么也不做。调试控制台中的快速检查告诉我，页面

无法获取未定义或空引用的属性“childNodes”

——这对我来说很奇怪，因为它在第一个实例中工作。 如果我在兼容性视图中运行页面，脚本会正常工作，但这会破坏我所有的样式设置等。 有没有办法解决这个问题，或者我将不得不处理一个糟糕的兼容性视图样式的页面？
我的代码在下面
HTML

<div id="MainNews">
    <div class="panel panel-default" id="MainNewsStory">
        <h1 id="StoryHeadline"></h1>
        <p id="StoryBody"></p>
    </div>
    <img id="StoryImage" src=""/>
</div>

<NewsArticle>
<Story>
    <StoryHeadline>This is the headline of the first news story!</StoryHeadline>
    <StoryBody>This is the body of the first news story. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam id nunc ex.</StoryBody>
    <StoryImage>Images\ImageOne.png</StoryImage>
</Story>
<Story>
    <StoryHeadline>This is the second headline! It accompanies the second story</StoryHeadline>
    <StoryBody>This is the body of the second news story. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam id nunc ex.</StoryBody>
    <StoryImage>Images\ImageTwo.png</StoryImage>
</Story>
<Story>
    <StoryHeadline>This is the third headline now!</StoryHeadline>
    <StoryBody>This is the body of the third news story. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam id nunc ex.</StoryBody>
    <StoryImage>Images\ImageThree.png</StoryImage>
</Story>

---

任何帮助都将不胜感激。

编辑：因此，我最初对此的“修复”在加载大约5页后停止工作，因此我深入研究了一下，并设法找到了问题的根源。

---

结果是两件事的结合。 我设法强迫我的页面样式和一切保持正常，即使在兼容性视图使用

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

---

所以现在一切都按照我的要求进行了

我不明白这与jquery有什么关系。当然，您使用jquery获取xml，但在与jquery无关的领域，它失败了。不是jquery不起作用。“如果我在兼容性视图中运行页面，脚本工作正常”~通过W3C标记验证器运行HTML并修复所有错误。@Sparky我尝试过，唯一的错误是

h1

是空的，

img

没有

src

-因为它们是从xml文件填充的，所以不应该有任何内容？如果我删除

fillStory

初始调用，这个页面根本就不会被填充。

设置间隔是否可能有问题？
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />

<?xml version="1.0" encoding="utf-8" ?>

var storyCount = 0;
    var xStories, xStoryBody, xStoryImage, maxStories;
    function fillStory() {
        xStories = xml.getElementsByTagName("StoryHeadline");
        xStoryBody = xml.getElementsByTagName("StoryBody");
        xStoryImage = xml.getElementsByTagName("StoryImage");
        maxStories = xStories.length;
        $("#StoryHeadline").html(xStories[(storyCount) % maxStories].childNodes[0].nodeValue);
        $("#StoryBody").html(xStoryBody[(storyCount) % maxStories].childNodes[0].nodeValue);
        $("#StoryImage").prop("src", xStoryImage[(storyCount) % maxStories].childNodes[0].nodeValue);
        storyCount = storyCount + 1;