Есть ли ошибка с document.write ()? - PullRequest
0 голосов
/ 11 ноября 2018

Мой код был примерно таким:

window.onload = function() {
    var x = document.createElement("INPUT");
    x.setAttribute("type", "text");
    x.setAttribute("value", "");
    document.body.appendChild(x);
}

И я хотел написать что-то еще, я добавил новую строку.

Как это:

window.onload = function() {
    var x = document.createElement("INPUT");
    x.setAttribute("type", "text");
    x.setAttribute("value", "");
    document.body.appendChild(x);
    document.write("<br>");
}

А потом внезапно мой тег ввода исчез.

Итак, я написал «AAA», чтобы проверить, был ли добавлен код <br>.

Как это:

window.onload = function() {
    var x = document.createElement("INPUT");
    x.setAttribute("type", "text");
    x.setAttribute("value", "");
    document.body.appendChild(x);

    document.write("<br>");
    document.write("AAA")
}

Есть новая строка и AAA.

Итак, я думаю, что есть ошибка или что-то с document.write().

Isесть ли ошибка?

Или я что-то не так написал?

Моя цель - добавить новую строку.

Я хочу, чтобы мой код работал правильно.

Есть ли способ решить эту проблему?

1 Ответ

0 голосов
/ 11 ноября 2018

Проблема в том, что, если страница уже загружена, document.write заменит всей страницы новой строкой HTML. Если вы удалили обработчик window.onload и просто запустили этот фрагмент, как только браузер перейдет к тегу <script>, оба значения <input> и <br> будут вставлены в документ, как и ожидалось:

<script language="javascript">
  var x = document.createElement("INPUT");
  x.setAttribute("type", "text");
  x.setAttribute("value", "");
  document.body.appendChild(x);
  document.write("<br>");
</script>

Как правило, решение состоит в том, чтобы не использовать document.write - его поведение может сбивать с толку, и оно не обеспечивает ничего, что не может быть выполнено так же легко с помощью таких методов, как appendChild и insertAdjacentHTML, например:

document.body.appendChild(document.createElement('br'));

или

document.body.insertAdjacentHTML('beforeend', '<br>');
...