Question

我想知道是否有可能修改XML文档并重新加载它而不会松散其在Javascript中的更改，我解释说：

我有一个包含不同数据的XML文件（自定义对象）。我使用XSLT转换在浏览器中显示这个XML。

在.xsl文件中，当我点击链接重新加载页面以显示xml中的一些信息时，我想使用Javascript来修改xml结构，并隐藏其他一些信息。

在我的xml中，我在不同类型A和B中有不同的对象。 A类型的对象包含B类型的对象（某种形式的agregagtion）和许多其他文本属性。所以在我的第一页中我想要列出一个对象，在表中有属性。在这个表中，类型B的属性由一个链接表示，当我点击链接时，我想重新加载页面并显示一个表（或其他一些东西）来表示B对象，而且只有B对象。

我认为有可能使用Javascript，如果我正确点击链接我可以删除根节点的所有子节点我的XML并且我追加B节点，我重新加载页面并且我显示只有B节点。

这是我的JQuery脚本：

var glob_id;
var glob_rootNode;
var glob_nodeParent;

function reloadFromNode(rootNode,nodeParent,id){
    // Définition de variables globales
    glob_id = id;
    glob_rootNode = rootNode;
    glob_nodeParent = nodeParent;

    $(document).ready(  
        function(){
            var urlOfFile = window.location.href;
            // Chargement du XML a partir de l'URL du fichier
            $.ajax( {
                type: "GET",
                url: urlOfFile,
                dataType: "xml",
                // XML chargé 
                success: function(xml) {
                    //Ajout d'un listenr sur le noeud racine
                    $(xml).find(glob_rootNode).each(
                        function()
                        {
                            $(this).bind("DOMNodeInserted", function() {
                                reloadDOM();
                            });
                        }
                    );
                    // Parcours de tous les "nodeParent", fils de la racine 
                    $(xml).find(nodeParent).each(   
                        function()
                        {
                            // Si l'id du noeud correspond à celui du lien cliqué
                            var thisNode = $(this);
                            if($(this).attr('id') == glob_id){
                                alert('load success id :' + id );
                                $(xml).find(glob_rootNode).each(
                                    function()
                                    {   
                                        // On supprime tous les fils de la racine
                                        $(this).removeChild(0);
                                        $(this).removeChild(1);
                                        $(this).append($(thisNode));
                                    }
                                );

                            }else if($(this).attr('id') == ''){
                                alert('No id find');
                            }
                        }
                    );
                }
            });
        }
    );
}

function reloadDOM(){
    alert("tree changed");
    $(window).trigger('resize');

}

这是我的xslt（它唯一涉及A对象的部分：

<?xml version="1.0" encoding="UTF-8" ?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" 
                xmlns:msxsl="urn:schemas-microsoft-com:xslt" 
                xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
                xmlns:js="urn:extra-functions">
    <xsl:template match="A">
        <table class="table">
            <tr>
                <th>A Objects</th>
            </tr>       
            <tr>
                <td>attr1</td>
                <td><xsl:value-of select="attr1"/></td>
            </tr>
            <tr>
                <td>attr2</td>
                <td><xsl:value-of select="attr2"/></td>
            </tr>
            <tr>
                <td>attr3</td>
                <td><xsl:value-of select="attr3"/></td>
            </tr>
            <tr>
                <td>attr4 B</td>
                <xsl:variable name="rootNode">composition</xsl:variable>
                <xsl:variable name="node">B</xsl:variable>
                <xsl:variable name="id"><xsl:value-of select="@id"/></xsl:variable>
                <td><a onclick='reloadFromNode(&apos;{$rootNode}&apos;,&apos;{$node}&apos;,&apos;{$id}&apos;)' href='#'><xsl:value-of select="engines"/></a></td>
            </tr>
            <tr>
                <td>attr5 B</td>
                <xsl:variable name="rootNode">composition</xsl:variable>
                <xsl:variable name="node">B</xsl:variable>
                <xsl:variable name="id"><xsl:value-of select="@id"/></xsl:variable>
                <td><a onclick='reloadFromNode(&apos;{$rootNode}&apos;,&apos;{$node}&apos;,&apos;{$id}&apos;)' href='#'><xsl:value-of select="enginesMap"/></a></td>
            </tr>
            <tr>
                <td>Name</td>
                <td><xsl:value-of select="attr6"/></td>
            </tr>
        </table>
    </xsl:template>
</xsl:stylesheet>

最后这是我的xml文件：

<?xml version="1.0" encoding="UTF-8" ?>
<?xml-stylesheet type="text/xsl" href="composition.xsl"?>
<composition xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="composition.xsd">
<A id="1">
    <attr1>35000</attr1>
    <attr2 id="2">
        <subAttr2>2</subAttr2>
    </attr2>
    <attr3 id="3">
        <subAttr3>9.5</subAttr3>
    </attr3>
    <attr4>
        <B id="4">
            <attr1>50</attr1>
        </B>
    </attr4>
    <attr5>
        <B id="5">
            <attr1>38</attr1>
        </B>
        <B id="6">
            <attr1>47</attr1>
        </B>
    </attr2>
    <attr6>the_name</attr6>
</A>
</composition>

目前我可以监听根节点修改（节点＆＃39;组合＆＃39;）但是当我用location.reload重新加载页面时，浏览器重新加载整个xml而不是修改xml。

使用Javascript进行XML实时修改

0 个答案: