如何按元素内容过滤解析的 XML 数据 [jQuery]

Posted 2023-02-24

【中文标题】如何按元素内容过滤解析的 XML 数据 [jQuery]

【英文标题】：How to Filter Parsed XML data by Element Content [jQuery]

【发布时间】：2019-01-28 13:19:53

【问题描述】：

所以我有一个 xml 房屋属性提要 [在 WordPress 网站上] 目前非常简单，它只是收集我想要显示的字段并将其显示为列表 [非常正常的东西] 但我现在需要能够制作两份清单，一份只显示已售出的房产，一份不显示已售出的房产。目前我的代码如下：

jQuery(function( $ )

$(document).ready(function()

    $.ajax(
        type: "GET",
        url: "/properties2.xml",
        dataType: "xml",
        success: parseXml
    );
);

function parseXml(xml)

    $("#xmlmain").html("<div id='content' data-role='listview' data-inset='true'></div>");
    $(xml).find("property").each(function() 
        $("#content").append("<div class='xmlwrapper'><div class='xmlleft'><img src='"+$(this).find('[name="Photo 1"]').text()+"'/></div><div class='xmlright'><h2>"+$(this).find("advert_heading").text()+"</h2><p class='price'>"+$(this).find
        ("price_text").text()+"</p><p class='priority'>"+$(this).find("priority").text()+"</p><p>"+$(this).find("main_advert").text()+"</p><a href='"+$(this).find("web_link").text()+"' target='_blank'>VIEW > </a></div></div>");
    );

);

我是 javascript 和 Jquery 的新手，所以我真的不知道如何过滤列表以排除已售出的属性，只包含已售出的属性。我如何调整/过滤它以获得所需的结果？我尝试使用 filter();功能，但它只是一直停止显示提要。

这是我试图合并/使用的 sn-p/示例：

var getTextNodesIn = function(el) 
return $(el).find(":not(iframe)").addBack().contents().filter(function() 
    return this.nodeType == 3;
    );
;

getTextNodesIn(el);

我需要使用的数据在下面显示的优先级字段中。这是 xml 提要的摘录：

<properties>
<property reference="MR139">
    <instructedDate>06/08/2018 17:07:05</instructedDate>
    <price_text>£600,000</price_text>
    <numeric_price>600000.0000</numeric_price>

    <priority>On Market</priority>

    <advert_heading>house for sale</advert_heading>
    <main_advert>some text about the property</main_advert>
    <web_link>www.example.com</web_link>
    <property_style>Detached</property_style>
    <property_reference>111111</property_reference>
    <newHome>NO</newHome>
    <noChain>NO</noChain>
    <furnished>Unknown</furnished>
    <currency>GBP</currency>
    <featuredProperty>NO</featuredProperty>
    <pictures>
        <picture name="Photo 1" lastchanged="2018-08-06T15:44:48.5800534Z">
            <filename>example.jpg</filename>
        </picture>
    </pictures>
</property>
</properties>

[如果有区别，已售物业的优先级字段中的文本将是“已售”或“已售 STC”。]

任何帮助都将不胜感激，即使它只是将我指向我可以使用的与我的问题相关的资源。我的搜索似乎出现了不相关的信息，这可能是由于我不正确了解术语而导致措辞错误。

【参考方案1】：

祝你好运伙计.. 似乎社区在现实生活中不使用 xml。我已经研究了好几天，甚至无法得到直接的答案来将 xml 存储在数据库中或使用 xquery 直接从 .xml 提要中获取我需要的数据......然后找到用户如何搜索的答案通过例如按价格顺序排列的价格和显示属性似乎相距数光年......

如果您使用 wordpress，它看起来像属性配置单元插件可能是您最好的选择...花费 150 英镑，但所有搜索都是为您完成的。

【讨论】：

谢谢伙计。是的，这是肯定的。我会尝试在这里获得足够的代表来悬赏这个问题，不知道在这个阶段现在还能做什么！不幸的是，我不能使用插件，因为该网站的人已经为没有我可以安装的插件的系统付费。典型的哈。

以为您在问题开始时说过：“在 WordPress 网站上”。您是否找到了如何将 xml 提要保存到关系数据库？您是否应该将图片存储在单独的表格中？如果是这样，这与 php 插入查询有关，因为我认为所有内容都必须链接到另一个表中的 property_id。

我确实在 wordpress 网站上说过。它在一个 wordpress 网站上，但这个家伙有一个专家代理系统，他想要 xml 连接到 wordpress 网站。所有数据都来自专家代理，因为他们的系统也会发布到 rightmove 和类似的其他地方。所以他通过他们的门户添加属性，然后将其发布到 xml 提要，然后我需要从中提取信息。

这就是属性配置单元的用途。代理-> 在专家代理上创建属性-> xml 提要-> 属性 hive/wordpress-> 将属性创建为帖子-> 在页面上显示。

Property hive 确实尝试成为 crm，但它也具有属性提要功能。您不必购买整个包裹（我不认为）。 wp-property-hive.com/addons/property-import（参见“属性导入”的第三个 div）我认为大多数网络公司都使用它很容易。我想更深入地挖掘而不使用wordpress....但无法在任何地方获得最佳实践...如果我是comercial预算的开发人员，我会使用它。

【参考方案2】：

您的过滤功能不正确。您使用 this 的方式与它在 JavaScript 中的使用方式不同。这是一个常见的错误，因为在大多数面向对象的编程语言中，this 的含义与 JS 中的不同。试试这个函数——继续阅读下面的sn-p的更好版本——：

var getTextNodesIn = function(el) 
return $(el).find(":not(iframe)").addBack().contents().filter(function(element) 
    return element.nodeType == 3;
    );
;

getTextNodesIn(el);

问题是Array.filter() 接收一个函数作为参数。然后为数组的每个元素调用该函数，如果函数返回true，则保留该元素。该函数接收元素作为参数。当函数被执行时，this 是对全局范围的引用（很奇怪，我知道）。

您的问题是您正在检查您的全局范围内名为 nodeType 的属性是否为 3。nodeType 很可能是 undefined，因此不等于 3，因此所有元素都从数组，你会得到一个空数组。

docs 中有关过滤器的更多信息。

除此之外，我建议您从代码中重新审视一些事情。

如果可能，切换到使用 JSON 而不是 XML。 JavaScript 有一个库来处理 JSON 字符串。事实上，JSON 代表 JavaScript Object Notation。你可以只做JSON.parse(data)，然后你会得到一个可以立即使用的 JavaScript 对象。在 JavaScript 中使用 JSON 比使用 XML 要好得多

在 JavaScript 中，双相等比较器在大多数情况下被认为是不好的做法。它可以给你意想不到的结果。例如"3" == 3 是真的。与双等号比较时，字符串 3 和数字 3 相同。大多数情况下，您会希望使用三等号，即比较被比较事物的值和类型

有一种更好的方法可以使用箭头函数编写在第一条语句中返回的函数，这是 ES6 中引入的语言特性。它还从外部范围自动绑定this，但这是另一天的故事

我建议您使用比“el”更有意义的名称。从上下文来看，“产品”似乎是一个更好的选择，但为了清楚起见，我将在示例中保留“el”。

你可以像这样写同样的 sn-p：

const getTextNodesIn = el =>
  $(el)
  .find(":not(iframe)")
  .addBack()
  .contents()
  .filter(element => element.nodeType === 3)

getTextNodesIn(el);

在我看来，这更易读，更清晰

【讨论】：

非常感谢您的回答先生！现在我已经按照我的意图工作了，我将使用您的信息来改进我当前的代码！非常感激。如果我能对这两个答案都给予赏金，我会的。

【参考方案3】：

您可以使用startsWith 方法在您的each 方法中检查priority 的值，如下所示。

$(xml).find("property").each(function() 
    var priority = $(this).find("priority").text();

    if(priority.startsWith('Sold')) 
        //for sold properties
     else 
        //for unsold properties
    
);

【讨论】：

您好，非常感谢您的回答，这对我来说非常有效。我确实有一个最后一个问题，你能在同一个命令中有多个startsWith条目吗？例如 > if(priority.startsWith('Sold', 'Sold STC')) > 或者我应该在循环中创建一个额外的步骤来做到这一点？基本上有什么更好的方法？

很高兴为您提供帮助。您可以使用多个startsWith，例如if(priority.startsWith('Sold') || priority.startsWith( 'Sold STC')) 。 @Moose