为什么我无法使用 Jquery 中的 append 函数将数据提取到我的 HTML 文件中？

Question

出于某种原因，我似乎无法使用 JQUERY 从 URL 中提取数据到我的 html 文件。 请帮我。 我是初学者

<html>
<head>
  <title> my program </title>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script type="type/javascript">
$(document).ready(function() {

$.ajax({
url:"My "
 }).then(function(data) {

          for(i = 0;i<data.articles.length; i++)

      {

             $('#list').append(data.articles[i].title+"<br/>");
         $('#list').append(data.articles[i].author+"<br/>");
         $('#list').append(data.articles[i].urlToImage+"<br/>");
         $('#list').append(data.articles[i].url+"<br/>");
         $('#list').append(data.articles[i].publishedAt+"<br/>");
         $('#list').append(data.articles[i].description+"<br/>"+"<hr/>");
     }
   });
});
</script>
</head>
<body>
  <div>
<p id="list">title</p>
<p id="list">author</p>
<p id="list">url</p>
<p id="list">description</p>
<p id="list">publishedAt</p>
</div>

</body>

</html>

这是我得到的结果这是我在浏览器中得到的结果：

标题

作者

网址

描述

发表于

我无法将标题、作者等数据提取到我的 html 文件中。

这是我试图产生的结果类型

Answer 1

id 在 html 中必须是唯一的。 由于您的 p-tags 具有相同的 id，jquery 可能只选择其中一个 - 可能是第一个，也可能是最后一个。 这可能不是您想要的。

所以我的建议是首先以独特的方式重命名 id。

假设数据有一个填充的对象数组，请尝试

// HTML

<div id="list"></div>

// JS

// having this dataset

var data = {
    articles: [
        {
            title: 'title 1',
            author: 'author 1',
            urlToImage: 'urlToImage 1',
            url: 'url 1',
            publishedAt: 'publishedAt 1',
            description: 'description 1'
        },

        {
            title: 'title 2',
            author: 'author 2',
            urlToImage: 'urlToImage 2',
            url: 'url 2',
            publishedAt: 'publishedAt 2',
            description: 'description 2'
        }
    ]
}

var i; 


for(i = 0; i< data.articles.length; i++ ){

    var section  = data.articles[i].title + "<br>";
        section += data.articles[i].author + "<br>";
        section += data.articles[i].urlToImage + "<br>";
        section += data.articles[i].url + "<br>";
        section += data.articles[i].publishedAt + "<br>";
        section += data.articles[i].description + "<br> <hr>";
    $('#list').append(section);

}

为什么我无法使用 Jquery 中的 append 函数将数据提取到我的 HTML 文件中？

问题描述

1 个解决方案

解决方案1
1 2019-01-16 13:51:35

为什么我无法使用 Jquery 中的 append 函数将数据提取到我的 HTML 文件中？

问题描述

1 个解决方案

解决方案1 1 2019-01-16 13:51:35

解决方案1
1 2019-01-16 13:51:35