1

我设法使用 -

wxml = window.open("my_template.xml", "my_xml" );

我设法使用 -

xDoc = wxml.document;
xNodes = xExDoc.getElementsByTagName("myNodeName");  
xValue = xNodes[i].getElementsByTagName("value")[0];
xValue.firstChild.nodeValue = nodeNewVal;

但我无法在屏幕上看到新的 DOM 值。

如何强制“通过 DOM 刷新屏幕”？

注意： reload() 不会有帮助，因为它会加载原始页面，并且我想查看带有 DOM 更改的页面。

编辑 - 我使用的代码：

XML 文件 (my_template.xml)：

<myXmlRoot>
<device>
  <input><name>"name 1"</name><value>{replaceMe!}</value></input>
  <input><name>"name 2"</name><value>{replaceMe!}</value></input>  
</device>
<device>
  <input><name>"name 1"</name><value>{replaceMe!}</value></input>
  <input><name>"name 2"</name><value>{replaceMe!}</value></input>  
</device>
<device>
  <input><name>"name 1"</name><value>{replaceMe!}</value></input>
  <input><name>"name 2"</name><value>{replaceMe!}</value></input>  
</device>
</myXmlRoot>

HTML 文件：

<html>
<head>
<title>Open XML in External Window</title>
</head>
<body>

<button onClick="fShowXmlInExternalWin()">Show XML </button> (does not show the updated version on the screen)

<script type="text/javascript" >

var wxml;
var xDoc;
var xDevices, xInputs;
var xDevice, xInput;

    function fSetXmlAInput(iDevice, iNode, nodeNewVal) {
      xInput = xInputs[iNode];
      xValue = xInput.getElementsByTagName("value")[0];

      // change node value:
      // console.log("nodeVal: " + xValue.firstChild.nodeValue);
      xValue.firstChild.nodeValue = nodeNewVal;
      // console.log("newVal: " + xValue.firstChild.nodeValue);
    }

    function fSetXmlDevice(iDevice) {
      xDevice = xDevices[iDevice];
      xInputs = xDevice.getElementsByTagName("input");
        fSetXmlAInput(iDevice, 0, "22");
        fSetXmlAInput(iDevice, 1, "33");
    }

    function fShowXmlInExternalWin() {
      wxml = window.open("my_template.xml", "my_xml" );
      xDoc = wxml.document;
      xDevices = xDoc.getElementsByTagName("device");
      fSetXmlDevice(1);
      return false;
    }

</script>

</body>
</html>
4

1 回答 1

1

在第一次查看时，您会遇到以下错误：

Timestamp: 6/5/2013 2:32:11 μμ
Error: ReferenceError: xExDoc is not defined

我没有在您的代码中的某处看到 xExDoc 定义...我只看到 xDoc。

更新：

此外，您的 i 变量未定义导致另一个错误。此外，您应该使用 firebug 逐步调试代码或至少添加

alert(xNodes.length);

为了检查找到了多少标签。

更新 2：（包括解决方案）

我发现了两种可能的选择：

  1. 使用带有 data:text/xml 的 window.open 直接呈现修改后的 XML。
  2. 使用 appendChild 和 removeChild 强制对 XML DOM 和浏览器进行重大更改以引用页面。

选项 1 保持 XML 浏览器格式不变，而选项 2 导致浏览器不再将 XML 视为 xml 内容并且格式丢失。

代码如下：

<html>
<head>
<title>Open XML in External Window</title>
</head>
<body>

<button onClick="fShowXmlInExternalWin()">Show XML </button> (shows updated on the screen but loses XML formatting)<br/>
<button onClick="alternativeLoadXML()">Alternative Show XML </button> (shows updated XML, as XML is loaded - changed, and XML is rendered)<br/>
<button onClick="alternativeLoadXML2()">Alternative Show XML 2  </button> (open window with original XML, change XML model, reload window)<br/>

<script type="text/javascript" >

var wxml;
var xDoc;
var xDevices, xInputs;
var xDevice, xInput;

    function fSetXmlAInput(iDevice, iNode, nodeNewVal) {
      xInput = xInputs[iNode];
      xValue = xInput.getElementsByTagName("value")[0];

      // change node value:
      // console.log("nodeVal: " + xValue.firstChild.nodeValue);
      xValue.firstChild.nodeValue = nodeNewVal;
      // console.log("newVal: " + xValue.firstChild.nodeValue);
    }

    function fSetXmlDevice(iDevice) {
      xDevice = xDevices[iDevice];
      xInputs = xDevice.getElementsByTagName("input");
        fSetXmlAInput(iDevice, 0, "22");
        fSetXmlAInput(iDevice, 1, "33");
    }

    function fShowXmlInExternalWin() {
      wxml = window.open("my_template.xml", "my_xml" );
      //Delay 500ms for window to load first
      window.setTimeout("triggerWindow()",500);
      return false;
    }

    //Further options Below 

    //First option, trigger refresh with append and remove - loses formatting

    function triggerWindow()
    {
        xDoc = wxml.document;
        xDevices = xDoc.getElementsByTagName("device");
        fSetXmlDevice(1);

        //Add and remove element to trigger referesh
        var p = document.createElement("test");
        xDoc.firstChild.appendChild(p);
        xDoc.firstChild.removeChild(p);
    }

    function alternativeLoadXML()
    {
        // load xml file
        if (window.XMLHttpRequest) {
           xhttp = new XMLHttpRequest();
        } else {    // IE 5/6
           xhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }

        xhttp.open("GET", "my_template.xml", false);
        xhttp.send();

        xDoc = xhttp.responseXML; 
        xDevices = xDoc.getElementsByTagName("device");
        fSetXmlDevice(1);

        var xmlText = new XMLSerializer().serializeToString(xDoc);      
        window.open('data:text/xml,' +  xmlText);
    }


    //Second option, open window, change XML, reload window with custom xml address

    function triggerWindow2()
    {
        xDoc = wxml.document;
        xDevices = xDoc.getElementsByTagName("device");
        fSetXmlDevice(1);

        var xmlText = new XMLSerializer().serializeToString(xDoc);      
        window.open('data:text/xml,' +  xmlText, "my_xml");
    }

    function alternativeLoadXML2()
    {
        wxml = window.open("my_template.xml", "my_xml" );
        //Delay 500ms for window to load first
        window.setTimeout("triggerWindow2()",500);
    }   

</script>

</body>
</html>

更新 3：

在新窗口上使用 document.open 和 document.write 可以在 IE 中输出正确的 XML，但 XML 渲染已关闭 - 似乎将内容渲染为 HTML ...

function alternativeLoadXML3() {
        // load xml file
        if (window.XMLHttpRequest) {
            xhttp = new XMLHttpRequest();
        } else { // IE 5/6
            xhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }

        xhttp.open("GET", "my_template.xml", false);
        xhttp.send();

        xDoc = xhttp.responseXML;
        xDevices = xDoc.getElementsByTagName("device");
        fSetXmlDevice(1);

        var xmlText = serializeXmlNode(xDoc);

        var newWindow = window.open("my_template.xml", "Test", "width=300,height=300,scrollbars=1,resizable=1");
        newWindow.document.open();
        newWindow.document.write(xmlText);
        newWindow.document.close()
    };
于 2013-05-06T11:34:18.913 回答