如何使用 javascript 数组填充 html 标题

How can I populate html titles with a javascript array?

本文关键字：html 标题 填充 数组 何使用 javascript      更新时间：2023-09-26

我在我的网站上设置了一个灯箱，标题如下所示

<div class="Container" id="">
    <a href="Link" title="titleVar">Cool Picture</a>
    <a href="Link" title="titleVar">Cool Picture</a>
    <a href="Link" title="titleVar">Cool Picture</a>
</div>

而且这个名单将继续增长。有没有办法让我有第二个文件来保存所有标题，并在"titleVar"所在的位置填充它们？现在我正在做的是将标题直接放在那里，代码变得非常混乱，因为标题有时会很长

编辑：为了澄清当我说"第二个文件"时，我的意思是专门为标题指定的单独的html或xhtml列表。我记得曾经看到过类似的东西，带有 span 标签

<span>title1
title2
title3
title4
title5</span>

这些能够被填充。问题是我找不到我执行此操作的文件

您可以设置一个.json文件并循环访问它以设置标题：

杰森：

{
    titles: [
        { title : 'some title' },
        { title : 'some other title' }
    ]
}

然后运行$.getJSON并迭代结果：

$.getJSON("titles.json", function(data) {
    $(".Container").children("a").each(function(index) {
        $(this).attr("title", data.titles[index].title);
    });
});

在你的javascript中，你可以设置一个数组，里面有你的所有titlevar，然后执行一个循环，将它们全部添加到容器中。

var titilevararray = ["title1", "title2"] //all your titlevars here
$.each(titlevararray, function(i, val){
    $("#Container").append('<a href="Link" title="'+val+'">Cool Picture</a>);
});

代码只是一个指导，因此请根据您的需要进行调整。

相关文章：