JavaScript/Menambah Unsur
Penampilan
Penggunaan Asas
[sunting]Dengan mengguna Model Objek Dokumen (DOM), kita dapat membuat unsur-unsur HTML pada dokumen. Mari kita reka div
.
var myDiv = document.createElement("div");
Bagaimana sekiranya anda mahu div
yang mengandungi id
atau class
?
var myDiv = document.createElement("div");
myDiv.id = "myDiv";
myDiv.class = "main";
Dan jika anda mahu menambahnya pada laman? Mari kita guna DOM sekali lagi...
var myDiv = document.createElement("div");
myDiv.id = "myDiv";
myDiv.class = "main";
document.documentElement.appendChild(myDiv);
Kegunaan Lanjut
[sunting]Katakan kita ada sebuah laman HTML ringkas...
<html>
<head>
</head>
<body bgcolor="white" text="blue">
<h1> Butang ringkas buatan JavaScript </h1>
<div id="butang"></div>
</body>
</html>
Di mana div
memiliki id
"butang". mari kita tambah butang:
myButton = document.createElement("input");
myButton.type = "button";
myButton.value = "butang saya";
placeHolder = document.getElementById("butang");
placeHolder.appendChild(myButton);
Kod HTML kelihatan demikian:
<html>
<head>
</head>
<body bgcolor="white" text="blue">
<h1> Butang ringkas buatan JavaScript </h1>
<div id="butang"></div>
</body>
<script>
myButton = document.createElement("input");
myButton.type = "button";
myButton.value = "butang saya";
placeHolder = document.getElementById("butang");
placeHolder.appendChild(myButton);
</script>
</html>
Sekarang laman akan memaparkan butang yang dijana oleh JavaScript.
Nota penterjemah: |