是否可以使用jquery $ .ajax添加，删除xml节点？

I want to delete some nodes or add some nodes in xml with jquery, I try it with append, empty, remove but all of them seem to not work, like (in $.ajax):

我想删除一些节点或在xml中使用jquery添加一些节点,我尝试使用append,empty,remove但是所有这些节点似乎都不起作用,如($ .ajax):

success:function(xml){
    $(xml).find("layout").append('<app id="' + $children.eq(i).attr("id") + '"></app>');
    $(xml).find("layout").empty();
}

also I find there is no tutorial on google. So I wonder is it possible add or delete nodes in xml with jquery?

我也发现谷歌没有教程。所以我想知道是否可以使用jquery在xml中添加或删除节点?

OK ,I write it in details,the xml file just save in local domain as Database/UserConfig/config.xml here is my Ajax code:

好的,我详细写了,xml文件只保存在本地域中,因为这里的Database / UserConfig / config.xml是我的Ajax代码:

function layout_change()
{
    var $children=$input.children();

    $.ajax({
        type: "get",
        url: "Database/UserConfig/config.xml",
        dataType: "xml",
        timeout: 2000,
        beforesend:function(xml){
            $(xml).find("layout").empty();
        },
        success:function(xml){
            for(var i=0;i<$children.length;i++)
            {
                $(xml).find("layout").append('<app id="' + $children.eq(i).attr("id") + '"></app>');              
            }
        },
        error:function(){}
    });
}

or it can be done with javascript?or can be only done with server language like C#?……

或者它可以用javascript完成?或者只能用C#这样的服务器语言来完成?......

here is my demo xml：

这是我的demo xml:

<layout>
        <app id="id-4"></app>
        <app id="id-5"></app>
        <app id="id-6"></app>
        <app id="id-1"></app>
        <app id="id-2"></app>
        <app id="id-3"></app>   
</layout>

1 个解决方案

#1

jQuery is a fantastic tool for parsing and manipulating XML in javascript. jQuery's ajax APIs were, in fact, built with this in mind which is why you're able to specify the response type of an ajax call by setting the dataType argument to xml (although they do try to do some auto-detection if this argument is omitted). From the jQuery $.ajax() documentation for the dataType argument:

jQuery是一个用于在javascript中解析和操作XML的绝佳工具。事实上,jQuery的ajax API是基于这个构建的,这就是为什么你能够通过将dataType参数设置为xml来指定ajax调用的响应类型的原因(尽管如果这个参数确实会尝试进行一些自动检测)被省略)。从dataType参数的jQuery $ .ajax()文档:

"xml": Returns a XML document that can be processed via jQuery.

“xml”:返回可以通过jQuery处理的XML文档。

You can parse and manipulate XML as much as want using jQuery. I'll have to add that using CSS selectors is wonderful compared to XPath queries in server-side XML libraries.

您可以使用jQuery尽可能多地解析和操作XML。我必须补充说,与服务器端XML库中的XPath查询相比,使用CSS选择器是很好的。

While empty and remove work as expected, there's a gotcha when adding nodes on the fly with functions like append: jQuery, for whatever reason (I haven't really dug into this), won't create the element for you when appending to the XML structure (although this works fine in HTML structures). You can get around this easily by explicitly creating the node yourself as a DOM element or jQuery object and then calling append:

虽然是空​​的并且按预期删除了工作,但是在使用append:jQuery等函数添加节点时会出现问题,无论出于何种原因(我还没有真正挖掘过这个),在添加到元素时不会为你创建元素XML结构(虽然这在HTML结构中工作正常)。您可以通过自己显式创建节点作为DOM元素或jQuery对象然后调用append来轻松解决这个问题:

//Either of these will work
var elem = document.createElement('app');
xml.find('layout').append(elem); // Appends <app></app> to <layout>
xml.find('layout').append($('<app>')); // Does the same

// You can also you use other manipulation functions such as `attr`
xml.find('layout').append($('<app>').attr('id', 'ego'));

It looks like, however, that there are other problems with your code that would be preventing it from behaving as expected. The $.ajax beforeSend callback, for example, passes in the XMLHttpRequest object to the callback function and not your XML object to be manipulated. The result is that your empty call in that callback does nothing.

但是,您的代码看起来还有其他问题会阻止它按预期运行。例如,$ .ajax beforeSend回调将XMLHttpRequest对象传递给回调函数,而不是要操纵的XML对象。结果是你在该回调中的空调不执行任何操作。

Also, if you're trying to manipulate the response of Database/UserConfig/config.xml in the beforeSend callback, it probably won't have existed yet since beforeSend is called before the ajax request is fired off. It's possible that the xml argument you intended to pass in was scoped globally, but it's squashed in the scope of the callback since jQuery is passing in XMLHttpRequest as I mentioned before.

此外,如果您试图在beforeSend回调中操纵Database / UserConfig / config.xml的响应,那么它可能不会存在,因为在关闭ajax请求之前调用beforeSend。你打算传入的xml参数可能是全局范围的,但它在回调范围内被压扁,因为jQuery正如我前面提到的那样传入XMLHttpRequest。