HTML DOM - распространение строки на несколько строк
В настоящее время я пытаюсь распространить строку на несколько строк в HTML/JS. Я использую Repl.It (возможно, это какая-то ошибка/функция на этой странице), но я не могу распространить его на несколько строк, используя "\n". Пожалуйста, порекомендуйте.
HTML-раздел:
<div id = "stats">
<script src = "script.js"></script>
</div>
JS-сторона:
function send_stats(message) {
document.querySelector("#stats").innerHTML = message;
}
send_stats("Stats:\nPlayer hp:" + player_hp + "\nMonster hp:" + monster_hp")
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
Вы должны использовать <br> вместо \n. И используйте Строки шаблона, а не используйте + снова и снова.
let monster_hp = 100.00
let player_hp = 90.00
function send_stats(message) {
document.querySelector("#stats").innerHTML = message;
}
send_stats(`Stats:<br>Player hp:${player_hp}<br>Monster hp:${monster_hp}`)<div id = "stats">
<script src = "script.js"></script>
</div>Используйте .innerText вместо innerHTML
var playerHp = 1;
var monsterHp = 30;
var msg = "Stats:\nPlayer hp: " + playerHp + "\nMonster hp: " + monsterHp;
function sendStats(sel, msg) {
document.querySelector(sel).innerText = msg;
}
sendStats('#stats', msg);<output id='stats'></output>.innerText нестандартный. Вместо этого используйте .textContent.
@СкоттМаркус «Эта функция была первоначально представлена в Internet Explorer и официально указана в стандарте HTML в 2016 году после того, как была принята всеми основными поставщиками браузеров». . Стандарт уже более 2х лет.
Кавычки относятся к спецификации WHATWG. Его нет в W3C DOM-API и поэтому он хоть и поддерживается, но не является стандартным. Есть API, где две спецификации. расходятся, и обычно лучше использовать то, что указано в спецификации W3C. Кроме того, он работает иначе, чем стандартный (textContent).
\n— это escape-код строки JavaScript..innerHTMLпредназначен для синтаксического анализа строк с помощью синтаксического анализатора HTML, поэтому вам нужно использовать решение HTML...<br>.