элемент javascript «: последний» путаница

Question

У меня возник вопрос о взаимодействии кода javascript с кодом HTML.

В этой части лекции я работаю, я положить в моей информации работы в .js файл, используя для цикла, который затем взаимодействует с другим .js и .html файлом для вывода моей работы/роль на index.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); 
} 

код работает отлично, но я пытаюсь понять, почему мы должны «: последний» в «.Работы-запись: последний». Другой файл, helper.js имеет только один вход элемента для «работы вхождения», чтобы начать с, как показано ниже:

var HTMLworkStart = '<div class="work-entry"></div>'; 
var HTMLworkEmployer = '<a href="#">%data%'; 
var HTMLworkTitle = ' - %data%</a>'; 

Так что я пытался вынимая «: последний» и результат начал делать случайные повторы к вывод "employerinfo".

Answer 1

:last - специальный мета-селектор jQuery. См. Пример в документации для уточнения. Что он делает, это выбрать только последний элемент в текущем выборе. Поскольку work-entry - это CSS-класс, он намекает, что может быть несколько элементов DOM, назначенных этому классу. Но ваш код, похоже, хочет добавить employerinfo только к последнему work-entry на вашей странице. Я предполагаю, что код будет выполнен, после добавления нового работодателя в ваш DOM. Поэтому, если бы у вас не было :last, оно добавило бы текущий employerinfo уже существующим работодателям, а не только недавно добавленный.