jquery 1.7的.parseHTML（）替代方案？

Posted 2023-01-19

我有一个ajax函数来加载来自RSS提要的图像但是因为我还在使用1.7.2而获得了.parsehtml is not a function error。不幸的是，升级到1.8不是一个选择......

$.ajax(
    type: "GET",
    url: "url.com/feed",
    dataType: "xml",
    success: function(xml) 
        var limit = 1;
        $(xml).find('item').each(function(index) 
            if (index < limit) 
                var title = $(this).find('title').text();
                var url = $(this).find('link').text();
                var pubDate = $(this).find('pubDate').text();
                var desc = $(this).find('description').text();
                desc = $.parseHTML(desc);
                var imgURL = desc[0].firstChild.srcset.split(',').pop().trim().split(' ')[0];
                var alt = desc[0].firstChild.alt;
                // Do something
                return;
            
        ); //end each
    
); 

我正在使用.praseHTML()来定位图像的最后一个srcset属性以获取其URL。这是我的RSS的样子

<item>
        <title>Geoffrey Martinez Brews Up a Good Cup of Java for Compton</title>
        <link>https://csudhnews.staging.wpengine.com/geoffrey-martinez/</link>
        <pubDate>Wed, 08 Aug 2018 16:09:29 +0000</pubDate>
        <dc:creator xmlns:dc='http://purl.org/dc/elements/1.1/'><![CDATA[Paul Browning]]></dc:creator>
                <category><![CDATA[Features]]></category>
        <category><![CDATA[Alumni]]></category>
        <category><![CDATA[Business]]></category>
        <category><![CDATA[Entrepreneurship]]></category>
        <category><![CDATA[Latin American Studies]]></category>

        <guid isPermaLink='false'>https://csudhnews.staging.wpengine.com/?p=32594</guid>
        <description><![CDATA[<div><img width='300' height='168' src='https://csudhnews.staging.wpengine.com/wp-content/uploads/2018/08/Geoffrey-Martinez0006_FEATURE-1-300x168.jpg' class='attachment-medium size-medium wp-post-image' alt='Alumnus Geoffrey Martinez of Patria Coffee' style='margin-bottom: 15px;' srcset='https://csudhnews.staging.wpengine.com/wp-content/uploads/2018/08/Geoffrey-Martinez0006_FEATURE-1-300x168.jpg 300w, https://csudhnews.staging.wpengine.com/wp-content/uploads/2018/08/Geoffrey-Martinez0006_FEATURE-1-768x430.jpg 768w, https://csudhnews.staging.wpengine.com/wp-content/uploads/2018/08/Geoffrey-Martinez0006_FEATURE-1-1024x573.jpg 1024w, https://csudhnews.staging.wpengine.com/wp-content/uploads/2018/08/Geoffrey-Martinez0006_FEATURE-1-630x350.jpg 630w, https://csudhnews.staging.wpengine.com/wp-content/uploads/2018/08/Geoffrey-Martinez0006_FEATURE-1-750x420.jpg 750w, https://csudhnews.staging.wpengine.com/wp-content/uploads/2018/08/Geoffrey-Martinez0006_FEATURE-1-200x111.jpg 200w, https://csudhnews.staging.wpengine.com/wp-content/uploads/2018/08/Geoffrey-Martinez0006_FEATURE-1.jpg 1500w' sizes='(max-width: 300px) 100vw, 300px' /></div>It wasn’t the billowing smoke filling his apartment courtyard from a popcorn machine with a convention oven mounted on top that initially piqued Geoffrey Martinez’s curiosity, it was the smell of freshly roasting coffee beans that drew him in. “I had never seen coffee roasting before so it definitely caught my attention,” said the California [&#8230;]]]></description>
</item>

答案

你真的不需要jQuery。 Ajax中的X首先代表XML。

https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/responseXML

使用responseXML属性来获取文档，然后就可以使用经典的DOM方法，如element.querySelector。

另一答案

如果您已通过responseXML响应XML文档，则可以直接查询描述，但如果您使用的是XML字符串，则可以使用DOMParser将XML（或HTML）源代码从字符串解析为DOM文档。

var xmlString = "YOUR XML STRING";
var parser = new DOMParser();
var xmlDoc = parser.parseFromString(xmlString, "text/xml");
console.log(xmlDoc.querySelector("description"));

另一答案

parseHTML()方法只在jQuery 1.8中添加，但有一个GitHub问题here应该有所帮助。基本上你应该做的是从jQuery中提取文件并将其与帮助程序一起使用，但这并不可靠。你为什么不能使用jQuery 1.8+？