Najlepszy samouczek JavaScript HTML DOM zmienia zawartość HTML W 2024 r. W tym samouczku możesz dowiedzieć się Zmiana strumienia wyjściowego HTML,Przykłady,Zmień zawartość HTML,Przykłady,Przykłady,Zmień atrybuty HTML,Przykłady,

JavaScript HTML DOM zmienia zawartość HTML

HTML DOM pozwala JavaScript, żeby zmienić zawartość elementu HTML.


Zmiana strumienia wyjściowego HTML

JavaScript może stworzyć dynamiczną zawartość HTML:

Dzisiejsza data to:Mon Sep 27 2021 10:00:25 GMT+0800 (中国标准时间)

W JavaScript document.write () może być stosowany do bezpośredniego Zapis zawartości HTML do strumienia wyjściowego.

Przykłady

<!DOCTYPE html>
<html>
<body>

<script>
document.write(Date());
</script>

</body>
</html>

Spróbuj »

lampa Nigdy nie należy używać document.write po zakończeniu ładowania dokumentu (). To przesłania dokumentu.


Zmień zawartość HTML

Korzystanie z właściwości innerHTML Najprostszym sposobem, aby zmodyfikować zawartość HTML.

Aby zmienić zawartość elementu HTML, należy użyć następującej składni:

document.getElementById(id).innerHTML=新的 HTML

Przykład ten zmienia zawartość elementu <p>:

Przykłady

<Html>
<Body>

<P id = "p1"> Hello World! </ P>

<Script>
document.getElementById ( "P1") innerHTML = "Nowy tekst !.";
</ Script>

</ Body>
</ Html>

Spróbuj »

Ten przykład zmienia zawartość elementu <h1>:

Przykłady

<!DOCTYPE html>
<html>
<body>

<h1 id="header">Old Header</h1>

<script>
var element=document.getElementById("header");
element.innerHTML="新标题";
</script>

</body>
</html>

Spróbuj »

Przykłady wyjaśnić:

  • Powyższy dokument HTML, który zawiera id = "header" w elemencie <h1>

  • Używamy DOM HTML, aby uzyskać id = "header" Element

  • JavaScript zmiany tego elementu treści (innerHTML)


Zmień atrybuty HTML

Aby zmienić właściwości elementu HTML, należy użyć następującej składni:

document.getElementById(id).attribute=新属性值

Ten przykład zmienia atrybut src elementu <img>:

Przykłady

<!DOCTYPE html>
<html>
<body>

<img id="image" src="smiley.gif">

<script>
document.getElementById("image").src="landscape.jpg";
</script>

</body>
</html>

Spróbuj »

Przykłady wyjaśnić:

  • Powyższy dokument HTML, który zawiera id = "obraz" elementu <img>
  • Używamy DOM HTML, aby uzyskać id = "image" Element
  • JavaScript zmienić właściwości tego elementu (dalej "smiley.gif" na "landscape.jpg")
JavaScript HTML DOM zmienia zawartość HTML
10/30