HTML DOM JavaScript HTML öğelerinin içeriğini değiştirmek için izin verir.
HTML Çıktı Akışı değiştirme
JavaScript dinamik HTML içeriği oluşturabilirsiniz:
Date: Sun Nov 06 2016 19:23:35 GMT+0800 (中国标准时间) Date: Sun Nov 06 2016 19:23:35 GMT+0800 (中国标准时间)
JavaScript'inizde document. write() document. write() HTML çıktı akımına doğrudan yazmak için kullanılabilir:
Örnek
<!DOCTYPE html>
<html>
<body>
<script>
document.write(Date());
</script>
</body>
</html>
Kendin dene " Hiçbir zaman kullanmak document. write() document. write() belge yüklendikten sonra. Bu belgeyi geçersiz kılar.
HTML İçerik değiştirme
Bir HTML öğesinin içeriğini değiştirmek için en kolay yolu kullanmaktır innerHTML özelliğini.
Bir HTML öğesinin içeriğini değiştirmek için şu sözdizimini kullanın:
document. getElementById( id ) .innerHTML = new HTML
Bu örnek, bir içeriğini değiştirir <p> elemanının:
Örnek
<html>
<body>
<p id="p1">Hello World!</p>
<script>
document.getElementById("p1").innerHTML = "New text!";
</script>
</body>
</html>
Kendin dene " Bu örnek, bir içeriğini değiştirir <h1> elemanı:
Örnek
<!DOCTYPE html>
<html>
<body>
<h1 id="header">Old Header</h1>
<script>
var element = document.getElementById("header");
element.innerHTML = "New Header";
</script>
</body>
</html>
Kendin dene " Örnek açıklanmıştır:
- HTML belgesi üzerinde bir içeriyor <h1> ile eleman id="header"
- Biz birlikte elemanı almak için HTML DOM kullanmak id="header"
- Bir JavaScript içeriği değişikliği (innerHTML) o elementin
Bir özelliğin değerini değiştirme
Bir HTML özelliğinin değerini değiştirmek için, şu sözdizimini kullanın:
document. getElementById( id ) . attribute=new value
Bu örnek, değeri değişir src bir öznitelik <img> elemanı:
Örnek
<!DOCTYPE html>
<html>
<body>
<img id="myImage" src="smiley.gif">
<script>
document.getElementById("myImage").src = "landscape.jpg";
</script>
</body>
</html>
Kendin dene " Örnek açıklanmıştır:
- HTML belgesi üzerinde bir içeriyor <img> ile eleman id="myImage"
- Biz birlikte elemanı almak için HTML DOM kullanmak id="myImage"
- Bir JavaScript değiştiren src o elemanın niteliğini "smiley.gif" için "landscape.jpg"
Egzersizleri ile Yourself test edin!
Egzersiz 1 » Alıştırma 2» Egzersiz 3 » Egzersiz 4» Egzersiz 5 »