我对javascript代码与HTML代码的交互有疑问。

在我正在研究的这一部分中,我将使用for循环将工作信息放入.js文件中,然后将其与其他.js.html文件进行交互以将我的工作/Angular 色输出到索引中。 html,我这样做是这样的:

for (var i = 0; i < work.length; i++) {
    var role = HTMLworkTitle.replace("%data%",work[i].role);
    var employer = HTMLworkEmployer.replace("%data%",work[i].name);
    var description = HTMLworkDescription.replace("%data%",work[i].Description);
    var employerinfo = employer + role;
    $("#workExperience").append(HTMLworkStart);
    $(".work-entry:last").append(employerinfo);
}

该代码可以正常工作,但是我试图理解为什么我们需要在“.work-entry:last”中使用“:last”。另一个文件helper.js开头只有一个元素条目“work-entry”,如下所示:
var HTMLworkStart = '<div class="work-entry"></div>';
var HTMLworkEmployer = '<a href="#">%data%';
var HTMLworkTitle = ' - %data%</a>';

因此,我尝试取出“:last”,结果开始对“employerinfo”输出进行随机重复。

最佳答案

:last 是一个 jQuery 特定的元选择器。请参阅文档中的示例以进行说明。它所做的只是选择当前选择中的最后一个元素。由于 work-entry 是一个 CSS 类,它暗示可能有多个 DOM 元素分配给这个类。但是您的代码似乎只想将 employerinfo 附加到您页面上的最后一个 work-entry 。我想代码会在新雇主添加到您的 DOM 后执行。因此,如果您没有 :last,它会将当前的 employerinfo 附加到已经存在的雇主,而不仅仅是新附加的雇主。

10-05 20:46
查看更多