javascript - 解析从 jQuery AJAX 请求返回的 HTML

标签 javascript jquery html ajax

我想做的事情看起来很简单:通过 $.ajax() 获取一个 HTML 页面并从中提取一个值。

$(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>'
        }
    });
});

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

fiddle我正在玩这个,但同时不能正常工作,所以我无能为力提供一个有效的例子。

更新:我的 new fiddle工作正常,但问题似乎是在我的实际项目中我试图解析大量复杂的 HTML。这是一个已知问题吗?

最佳答案

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

URL: /echo/html/

Data has to be provided via 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>'
        }
    });
});

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

关于javascript - 解析从 jQuery AJAX 请求返回的 HTML,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20007721/

相关文章:

Javascript 变量 - Getter 问题

javascript - 为什么我必须将字符串插入数组才能再次将其连接回来?

javascript - 为什么 jqGrid 拒绝使用 OnSelectRow 事件多次调用它的 Ajax 调用

javascript - Facebook如何检查用户是否喜欢页面并显示内容?

html - 为什么使用 this.src 时此图像不会在鼠标悬停时发生变化?

javascript - jQuery .html 不适用于已加载的模板

javascript - 无法处理对 Node 的 POST 请求的 Mailgun webhook 参数

jquery - jQuery.fn.empty() 和 jQuery.fn.html ('' ) 之间有什么区别?

html - 将元素对齐到上一行的底部

html - 无法将按钮放在图片下方或上方的图像上