En son web geliştirme öğreticiler
 

JavaScript HTML DOM - Değişen HTML


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 »