Javascript Reverse UL List Items - Hallo sahabat Dev-Create, Pada Artikel yang anda baca kali ini dengan judul Javascript Reverse UL List Items, kami telah mempersiapkan artikel ini dengan baik untuk anda baca dan ambil informasi didalamnya. mudah-mudahan isi postingan
Artikel <li>,
Artikel <ul>,
Artikel array,
Artikel javascript,
Artikel javascript array,
Artikel Javascript Reverse UL List Items,
Artikel Reverse UL List Items, yang kami tulis ini dapat anda pahami. baiklah, selamat membaca.
Judul : Javascript Reverse UL List Items
link : Javascript Reverse UL List Items
In This Javascript Tutorial we will See How To Reverse All <LI> Elements From A <UL> List Using Array And For Loop In JS And Netbeans Editor .
Anda sekarang membaca artikel Javascript Reverse UL List Items dengan alamat link https://dev-create.blogspot.com/2017/11/javascript-reverse-ul-list-items.html
Judul : Javascript Reverse UL List Items
link : Javascript Reverse UL List Items
Javascript Reverse UL List Items
How To Reverse All LI From A UL List Using Javascript
In This Javascript Tutorial we will See How To Reverse All <LI> Elements From A <UL> List Using Array And For Loop In JS And Netbeans Editor .
Project Source Code:
<!DOCTYPE html>
<html>
<head>
<title>Javascript: reverse All LI</title>
<meta charset="windows-1252">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<ul id="list">
<li>0</li>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li>8</li>
<li>9</li>
</ul>
<script>
var items = document.querySelectorAll("#list li"),
tab = [];
// populate array with li values
for(var i = 0; i < items.length; i++){
tab.push(items[i].innerHTML);
}
// clear UL
document.getElementById("list").innerHTML = "";
var list = document.getElementById("list");
tab.reverse();
for(var i = 0; i < tab.length; i++){
var textNode = document.createTextNode(tab[i]),
liNode = document.createElement("LI");
liNode.appendChild(textNode);
list.appendChild(liNode);
}
</script>
</body>
</html>
OUTPUT:
Demikianlah Artikel Javascript Reverse UL List Items
Sekianlah artikel Javascript Reverse UL List Items kali ini, mudah-mudahan bisa memberi manfaat untuk anda semua. baiklah, sampai jumpa di postingan artikel lainnya.
Anda sekarang membaca artikel Javascript Reverse UL List Items dengan alamat link https://dev-create.blogspot.com/2017/11/javascript-reverse-ul-list-items.html
