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 » | 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")