Question

我目前正在尝试将字符串分散到HTML / JS的多行中。我正在使用Repl.It（可能是此页面上的一些错误/功能），但是我无法使用“ \ n”将其分散到多行中。请告知。

HTML div：

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

Answer 1

您应该使用<br>而不是\n。并且使用Template Strings而不是一次又一次使用+。

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>

Answer 2

使用.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>

HTML DOM-将字符串扩展到多行

2 个答案: