[英]How can I reference an element after I have appended it using javascript not jquery
[英]How can i append a div after 5 results gotten from the database have been appended using jquery?
我想在此 jquery 代碼的每五個結果后附加一個 div。
$.each(employees, function(index, employee) {
$('#employeeList').append('<li>'+
'<img src="js/citybus.png" class="list-icon"/>' +
'<p class="line1">' + employee.firstName + '</p>' +
'<p class="line2">' + difference +'</p>' +
'<center><button onclick="setReminderClose();" id="reminderSetBox">Reminder Has Been Set</button></center>' +
'<button data-diff="' + hoursMin + '" data-name="' + employee.firstName + '" class="bubble" onclick="setReminder(this);">' + '<center><img src="js/bell.png" style="height:15px;width:15px;"/></center>' + '</button></li>');
});
setTimeout(function(){
scroll.refresh();
});
});
您可以檢查索引的值,如果index % 5 === 0
然后附加一個新的div
。
你可以通過編寫 if else 條件檢查來做到這一點
employees = [ { "firstName": "Fname1", "lastnName": "lastnName2" }, { "firstName": "Fanme2", "lastnName": "lastnName2" }, { "firstName": "Fname3", "lastnName": "lastnName2" }, { "firstName": "Fname4", "lastnName": "lastnName4" }, { "firstName": "Fname5", "lastnName": "lastnName5" }, { "firstName": "Fname6", "lastnName": "lastnName6" }, ]; $.each(employees, function(index, employee) { if(index >0 && (index + 1) % 5 == 0){ $('#employeeList').append('<div class="green"><li>'+ '<p class="line1">' + employee.firstName + '</p>' + '<p class="line2">' + employee.lastnName +'</p>' + '</li></div>'); }else{ $('#employeeList').append('<li>'+ '<p class="line1">' + employee.firstName + '</p>' + '<p class="line2">' + employee.lastnName +'</p>' + '</li>'); } });
.green{ background-color:green; }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div id="employeeList"> </div>
對於價值觀
index >0 and (index+1) % == 0 (as index starts with '0')
這是一個小提琴。 我已經進行了測試 json 鍵值對並實現了它。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.