JavaScript 保存来自 ajax 请求的数据

Question

挑战： 在 URL1（随机维基百科页面）上，向 URL2（100 个最常用词维基百科页面）发出 ajax 请求，从返回的数据中格式化列表以供以后使用。

我必须在“URL1”上从控制台运行它 示例：

1. 导航到 URL1
2. 打开控制台
3. 粘贴代码
4. 回车

到目前为止，我已经能够在 URL1 上使用以下内容获取整个 html 源代码：

$.ajax({
    url: 'https://en.wikipedia.org/wiki/Most_common_words_in_English',
    type: 'GET',
    dataType: 'html',
    success: function (response) {
        console.log(response); // works as expected (returns all html)
    }
});

我可以在控制台中看到整个 HTML 源代码——然后我转到 URL2 以了解如何获取和格式化我需要的内容，我能够做到这一点：

var array = $.map($('.wikitable tr'),function(val,i){
        var obj = {};
        obj[$(val).find('td:first').text()] = $(val).find('td:last').text();
        return obj;
    });
console.log(JSON.stringify(array));

现在这就是我的问题所在——将两者结合起来

$.ajax({
url:'https://en.wikipedia.org/wiki/Most_common_words_in_English',
type:'GET',
dataType:'html',
success: function(data){
    // returns correct table data from URL2 while on URL2 -- issue while running from URL1
    var array = $.map($('.wikitable tr'),function(val,i){
        var obj = {};
        obj[$(val).find('td:first').text()] = $(val).find('td:last').text();
        return obj;
        });
console.log(JSON.stringify(array));
    };
});

我猜这是因为我想要映射的 HTML 现在是一个字符串，而我的数组正在当前页面上寻找它当然找不到的 HTML 元素。

谢谢

Answer 1

这里简单修复！你说得对，它不会解析你返回的 html，所以只需告诉 jQuery 将其转换为可以使用$(data) 的对象并使用它来查找你需要的内容。

实质上，您的“文档”现在变为$(data)，您将使用它作为所有查询的来源。

 $.ajax({
   url: 'https://en.wikipedia.org/wiki/Most_common_words_in_English',
   type: 'GET',
   dataType: 'html',
   success: function(data) {
     var myVar = data;
     Names = $.map($(myVar).find('.wikitable tr'), function(el, index) {
       return $(el).find('td:last').text()
     });
     console.log(Names);
   }
 });