Лучшее руководство по JavaScript HTML DOM изменяет содержание HTML в 2024 году. В этом руководстве вы можете изучить Изменение выходной поток HTML,примеров,Изменение содержимого HTML,примеров,примеров,Изменение атрибутов HTML,примеров,

JavaScript HTML DOM изменяет содержание HTML

HTML DOM позволяет JavaScript изменять содержимое элемента HTML.


Изменение выходной поток HTML

JavaScript может создавать динамический контент HTML:

Сегодняшняя дата:Mon Sep 27 2021 14:20:39 GMT+0800 (中国标准时间)

В JavaScript document.write () можно использовать для непосредственного запись содержимого HTML в выходной поток.

примеров

<!DOCTYPE html>
<html>
<body>

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

</body>
</html>

Попробуйте »

лампа Никогда не используйте document.write после того, как документ завершил загрузку (). Это отменяет документ.


Изменение содержимого HTML

Использование innerHTML свойству Самый простой способ изменить содержимое HTML.

Чтобы изменить содержимое HTML-элемента, используйте следующий синтаксис:

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

Этот пример изменяет содержимое элемента <p>:

примеров

<HTML>
<Body>

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

<Script>
document.getElementById ( "p1") innerHTML = "новый текст !.";
</ Script>

</ Body>
</ HTML>

Попробуйте »

Этот пример изменяет содержимое элемента <h1>:

примеров

<!DOCTYPE html>
<html>
<body>

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

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

</body>
</html>

Попробуйте »

Примеры объяснить:

  • Выше HTML-документ, который содержит ID = "заголовок" элемента <h1>

  • Мы используем HTML DOM, чтобы получить идентификатор = элемент "заголовок"

  • JavaScript изменения на этом элементе содержимого (innerHTML)


Изменение атрибутов HTML

Чтобы изменить свойства элемента HTML, используйте следующий синтаксис:

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

В этом примере элемент атрибута SRC <IMG>:

примеров

<!DOCTYPE html>
<html>
<body>

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

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

</body>
</html>

Попробуйте »

Примеры объяснить:

  • Выше HTML-документ, который содержит ID = "образ" элемента <IMG>
  • Мы используем HTML DOM, чтобы получить идентификатор = элемент "образ"
  • JavaScript изменить свойства этого элемента ( "smiley.gif" до "landscape.jpg")