通过 jQuery 中的循环为每种类型添加链接答案

【问题标题】：Adding links for each genre through loops in jQuery通过 jQuery 中的循环为每种类型添加链接
【发布时间】：2017-11-12 03:07:40
【问题描述】：

我一直在试图弄清楚 d) 并且非常感谢任何帮助！

下面是作业。除了最后一个，我都完成了

"使用课程内容中可用的入门代码，添加以下数组：

var genres = ["Fiction", "Comedy", "Drama", "Horror", "Non-fiction", "Romance", "Satire"];

a) 首先创建一个元素并附加到正文。遍历数组，将“li”元素添加到“ul”中，将每个数组项作为“li”内容。

b) 与其创建列表，不如创建一个表格并将每个数组项放在一个“td”（表格列）中

c) 创建表格行而不是列。

d) 在上面使用的循环之外，将每个单词变成一个链接，并链接到该单词的维基百科页面（target="_blank"）。请注意 Wikipedia 如何在网站上构建其 URL。"**

如何做到这一点？

【问题讨论】：

到目前为止你做了什么工作？ SO 不是家庭作业服务。
如果您能提供给我们fiddle 会很好。这将有助于我们帮助您解决您的问题..
我知道它不是硬件服务，但我正在苦苦挣扎。我没有要求完整的答案，而只是举例说明如何完成最后一部分。
jsfiddle.net/41xdpuek/1

标签： jquery html arrays loops href

【解决方案1】：

遍历数组 - 为每个链接创建一个 str，然后将其传递到 html 以创建 wiki 链接列表。具有仅修改一次 DOM 的额外好处。

请注意，维基百科页面的 href 结构是“https://en.wikipedia.org/wiki/Fiction”，因此您只需在字符串中构建并在末尾替换数组的每个项目。

var str='';

var genres = ["Fiction", "Comedy", "Drama", "Horror", "Non-fiction", "Romance", "Satire"];

genres.forEach(function(genre) {
 str += '<li><a href="https://en.wikipedia.org/wiki/'+genre+'">'+ genre + '</a></li>';
})

document.getElementById('wikiLinks').innerHTML = str;

&lt;ul id = 'wikiLinks'&gt;&lt;/ul&gt;

【讨论】：

非常感谢您的解释。
没问题 - 乐于助人。顺便说一句，如果你想要上面的 jQuery 等价物 - 这将是 $('#wikiLinks').html(str);并确保将其包装在 document.ready 包装器中。编码愉快。