解析从jQuery AJAX请求返回的HTML

Question

解析从jQuery AJAX请求返回的HTML

Ste*_*ins 21 html javascript ajax jquery

我正在尝试做的事情似乎很简单:获取一个HTML页面$.ajax()并从中提取一个值.

$(function () {
    $.ajax({
        url: "/echo/html",
        dataType: "html",
        success: function (data) {
            $('#data').text(data);
            $('#wtf').html($(data).find('#link').text());
        },
        data: {
            html: '<!DOCTYPE html><head><title><\/title><link href="../css/popup.css" rel="stylesheet" /><\/head><body><ul><li><a id="link">content<\/a><\/li><\/ul><\/body><\/html>'
        }
    });
});

Run Code Online (Sandbox Code Playgroud)

问题是jQuery拒绝解析返回的HTML.

在拨弄我这个在打不中的平均时间工作,所以有一点我可以做,以提供一个工作的例子.

更新:我的新小提琴工作正常,但似乎问题是,在我的实际项目中,我正在尝试解析大量复杂的HTML.这是一个已知的问题吗？

Answer 1

Roc*_*mat 18

你的代码运行正常.您只是没有正确使用jsFiddle的API.查看文档/echo/html/(http://doc.jsfiddle.net/use/echo.html#html):

网址:/ echo/html /

必须通过POST提供数据

因此,您需要更新AJAX调用以使用POST.还需要尾随斜杠.

$(function () {
    $.ajax({
        url: "/echo/html/",
        type: "post",
        dataType: "html",
        success: function (data) {
            $('#data').text(data);
            $('#wtf').html($(data).find('#link').text());
        },
        data: {
            html: '<!DOCTYPE html><head><title><\/title><link href="../css/popup.css" rel="stylesheet" /><\/head><body><ul><li><a id="link">content<\/a><\/li><\/ul><\/body><\/html>'
        }
    });
});

Run Code Online (Sandbox Code Playgroud)

演示:http://jsfiddle.net/hcrM8/6/

@wtfsven：你的*真实*页面上发生了什么？你看到了什么？有错误吗？当执行“$(data)”时，jQuery 会去掉“<html>”、“<head>”和“<body>”标签。您的 jQuery 对象如下所示：“[<title>, <link>, <ul>]”。您真实页面上的 HTML 有效吗？根据其结构，您可能还需要“.filter”与“.find”。 (2认同)

Answer 2

Ant*_*ono 7

如果你想解析它,jquery有一个漂亮的技巧:)

 ParsedElements = $(htmlToParse);
 Console.log(ParsedElements);

Run Code Online (Sandbox Code Playgroud)

您现在拥有DOM可以遍历的元素,而无需将它们放在文档正文中.

但那只是问题所在.它根本不解析HTML.`$('#wtf').html($(data).find('#link').text());`应该返回"content",但是它说`text()`是未定义的. (3认同)

归档时间：	11 年，11 月前
查看次数：	86110 次
最近记录：	6 年，11 月前