Question

我正在开发一个仅限IE6的内部遗留网站。 IE8 / 9因使用XML Data Island特定脚本而失败。目标是修改IE9上可以查看的站点。其他浏览器不是问题。

有数千页及以上的100多个JS文件，所以这里的另一个目标不是重写所有内容，而是要修复我们为IE9启用网站的能力。

我不完全确定我这样做是正确的，但以下是典型页面布局的示例。我把它浓缩成一个小测试，以证明什么是有效的，什么是无效的。

作品

XML Data Islands的初始绑定。
当更新一个XML元素时，相同的XML元素将在页面的其他位置更新（修改两个输入字段之一的值，另一个输入字段将在失去焦点时跟随套件）。

不工作

在值发生变化后检索XML数据岛的值（至少我是如何尝试的）。
保持绑定到XML Data Islands的字段与嵌入式XML同步。

重现问题的步骤

（确定）单击查看消息按钮，正确显示嵌入式xml中的值。
（ok）更改其中一个输入字段中的值;另一个是正确更新的。
（不行）再次点击查看消息按钮;消息的新值未更新。
（1/2 ok）点击修改消息按钮，更新XML;但是不会更新绑定到XML数据岛的输入字段。
（确定）再次单击查看消息按钮;正确显示更新了XML值的脚本。

示例

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

<html>
<head>
    <title>Data Islands</title>

    <xml id="ResultsIsland">
        <result>
            <msg>Initial Message</msg>
        </result>
    </xml>

    <script type="text/javascript">
        function modifyDataIsland() {
            var dataIsland = document.getElementById("ResultsIsland");
            var xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
            xmlDoc.loadXML(dataIsland.innerHTML);

            var xmlRoot = xmlDoc.documentElement;
            xmlRoot.getElementsByTagName("msg")[0].text = new Date();
            dataIsland.innerHTML = xmlDoc.xml;

            alert("msg element updated to: " + xmlRoot.getElementsByTagName("msg")[0].text);
        }

        function viewMessage() {
            var d = document.getElementById("Message");
            var dataIsland = document.getElementById("ResultsIsland");
            var xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
            xmlDoc.loadXML(dataIsland.innerHTML);
            d.innerHTML = xmlDoc.getElementsByTagName("msg")[0].text;
        }
    </script>
</head>
<body style="margin: 100px;">

<div style="margin: 10px;">
    <button onclick="viewMessage();">view message</button>
    message is: <span id="Message"/>
</div>

<table datasrc="#ResultsIsland" style="margin: 10px;">
    <tr>
        <td>
            message: <input type="text" datafld="msg" />
        </td>
    </tr>
</table>

<table datasrc="#ResultsIsland" style="margin: 10px;">
    <tr>
        <td>
            message: <input type="text" datafld="msg" />
        </td>
    </tr>
</table>

<div style="margin: 10px;">
    <button onclick="modifyDataIsland();">modify message</button>
</div>

</body>
</html>

问题：是否可以使用IE9更新XML数据岛，以便更改反映在嵌入式XML和绑定数据字段中？

Answer 1

经过各种测试，我发现迫使IE9进入怪癖模式可以让IE9与XML Data Islands很好地配合。这允许您为XML Data Islands使用IE5 / 6脚本。

以下是在IE9中运行的修订示例：

<!--
    This comment and the following DocType forces IE9
    into quirks mode which is needed for the XML Data Islands
-->
<!DOCTYPE HTML>

<html>
<head>
    <title>Data Islands</title>

    <xml id="ResultsIsland">
        <result>
            <msg>Message</msg>
        </result>
    </xml>

    <script type="text/javascript">
        function modifyDataIsland() {
            var xml = document.all("ResultsIsland").XMLDocument;
            xml.getElementsByTagName("msg")[0].text = new Date();
            alert('msg element updated to: ' + xml.getElementsByTagName("msg")[0].text);
        }

        function viewMessage() {
            var xml = document.all("ResultsIsland").XMLDocument;
            document.getElementById("Message").innerHTML = xml.getElementsByTagName("msg")[0].text;
        }
    </script>
</head>
<body style="margin: 100px;">

<p style="margin: 30px 10px;">
   Document is in
    <strong>
    <script type="text/javascript">document.write(document.compatMode)</script>
    </strong> mode.
</p>

<div style="margin: 10px;">
    <button onclick="viewMessage();">view message</button>
    message is: <span id="Message"></span>
</div>

<table datasrc="#ResultsIsland" style="margin: 10px;">
    <tr>
        <td>
            message: <input type="text" datafld="msg"/>
        </td>
    </tr>
</table>

<table datasrc="#ResultsIsland" style="margin: 10px;">
    <tr>
        <td>
            message: <input type="text" datafld="msg"/>
        </td>
    </tr>
</table>

<div style="margin: 10px;">
    <button onclick="modifyDataIsland();">modify message</button>
</div>

</body>
</html>

使用IE9更新XML数据岛

1 个答案: