Javascript - как отображать перевод строки и как выводить переменные на страницу - PullRequest
Новая
       10

Javascript - как отображать перевод строки и как выводить переменные на страницу

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

В теле не может быть представлено значение переменной, а отображается только имя переменной «var1».Кроме того, я использую «\ n» в document.write, но как получается, что он не прерывает строку в результате? 

    <script type="text/javascript">
        var var1=123;
        document.write("<strong>Hello World! \nThis is the second line.</strong>");
    </script>
</head>
<body>
    <h1>the value for number is:  + var1</h1>
</body>

Ответы [ 3 ]

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

Используйте тег разрыва строки, br вместо \ n.

Что касается отображения переменной:

Переменная var1 может использоваться только внутри блока кода javascript.Строка 

<h1>the value for number is:  + var1</h1>

не будет выполняться как фактический код JavaScript, поскольку она не находится внутри блока JavaScript.Вы можете сделать это так: 

<head />
    <script>
        function main() {
            var var1=123;
            document.getElementById("text").innerHTML += var1
        }
        document.write("<strong>Hello World! <br />This is the second line.</strong>");
    </script>
</head>
<body onLoad="main()">
    <h1 id="text">the value for number is: </h1>
</body>
0 голосов
/ 24 ноября 2018

Что касается переменной части вопроса, есть как минимум 2 способа достижения того, что вы хотите:

Метод 1

Используйте DOM Manipulation для изменениявнутренний текст тега h1 выглядит так: 

var var1=123;
document.getElementsByTagName('h1')[0].innerText = "the value for number is: " + var1

Метод 2

Вы можете написать html в формате EJS (Embedded Javascript), где по сути вы можете передатьпеременные непосредственно к тегам html: 

<% var var1=123; %>
<h1>the value for number is: <%= var1 %></h1>

Если вы заинтересованы в изучении EJS, посмотрите здесь .Стоит отметить, что EJS является внешней библиотекой (спасибо cale_b за то, что указал на это в комментариях)

Что касается части вопроса о разрыве, вам нужно заменить «n \»: 

document.write("<strong>Hello World! <br/>This is the second line.</strong>");
0 голосов
/ 24 ноября 2018

Вот базовый пример. 

const name = 'john doe'; 
const header = document.createElement('h1');
const text = document.createTextNode(`my name is ${name}`); 

header.appendChild(text);
document.body.appendChild(header);
...