относительно работы innerHTML для цикла for в jscript

1

Мой HTML-код, в котором я хочу знать, что происходит, когда я использую text вместо text+:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Loops</h2>

<div id="demo"></div>

<script>
var cars = ["BMW", "Volvo", "Saab", "Ford", "Fiat", "Audi"];
var text = "";
var i;
for (i = 0; i < cars.length; i++) {
    text+=cars[i]+"<br>";
    document.getElementById("demo").innerHTML = text;
}
</script>

</body>
</html>
  • 2
    Чего ты хочешь ?
  • 0
    Только text его заменяет предыдущее добавленное значение новым при каждой загрузке.
Показать ещё 4 комментария
Теги:
innerhtml

4 ответа

1

Оператор = оператор присваивания. Он присваивает значение переменной, перезаписывая старое значение:

var a = 'Hello, ';
a = 'World!';
console.log(a); // logs 'World!'

+= Оператор является оператором присваивания дополнения. Он добавляет значение к значению переменной:

var a = 'Hello, ';
a += 'World!';
console.log(a); // logs 'Hello, World!'

Это эквивалентно:

var a = 'Hello, ';
a = a + 'World!';
console.log(a); // logs 'Hello, World!'
Поделиться
1

text+=cars[i]

Этот код означает, что вы добавляете i-й индекс массива автомобилей в конец строки "текст". Его можно было бы переписать следующим образом:

text = text + cars[i]

поэтому document.getElementById("demo").innerHTML = text; говорит браузеру, чтобы написать содержимое text переменной внутри HTML с id = "demo"

для каждой итерации значения цикла for text переменной передается. Поскольку text+=cars[i]+"<br>"; до document.getElementById("demo").innerHTML = text; это значение изменяется в соответствии с элементом, находящимся в индексе i массива cars.

на первой итерации i = 0 поэтому первый элемент массива BMW становится значением text и передается в document.getElementById("demo").innerHTML = text;

во второй итерации я = 1, и значение text становится Volvo и так далее, пока вы не достигнете конца массива, а i < cars.length больше не i < cars.length, и управление i < cars.length цикл for.

Поделиться
  • 0
    да, я знаю, что часть .. мое сомнение в части document.getElement в цикле for. Как это работает в каждом цикле ??
  • 0
    @HemanthKumar отредактировал ответ. надеюсь, это понятно.
Показать ещё 5 комментариев
1

Если вы замените текст text+ текстом, вы получите Audi как выход.

Если ваш вопрос заключается в том, что text+ и innerHTML заданы в цикле, но все же он не добавляется дважды? то ответ - innerHTML работает таким образом, что он переопределяет существующие значения.

Поделиться
0 
for (i = 0; i < cars.length; i++) {
    text+=cars[i]+"<br>";
    document.getElementById("demo").innerHTML = text;
}
// This produces :

BMW
Volvo
Saab
Ford
Fiat
Audi

// While this
for (i = 0; i < cars.length; i++) {
    text=cars[i]+"<br>";
    document.getElementById("demo").innerHTML = text;
}
// Produces :
Audi

Потому что, когда вы говорите:

text+=cars[i]+"<br>";

Это означает: (добавить автомобили [i] + "
"к тексту, но сохранить прежнее значение)

text= text + cars[i]+"<br>";

Но когда вы говорите:

text=cars[i]+"<br>";

Вы имеете в виду замену старого значения текста на cars[i]+"<br>" каждый раз, так что вы получите последнее значение.
++ Улучшение:

for (i = 0; i < cars.length; i++) {
    text+=cars[i]+"<br>";
}
document.getElementById("demo").innerHTML = text; // use this outside of the loop
Поделиться
  • 0
    hello.u получил мою проблему. Я знаю, как все это идет, как вы уже объяснили. Моя единственная проблема - понимание раздела document.getElement? будет ли печататься значение только после окончания цикла, а не после каждого цикла, как это обычно происходит с другими языками программирования.
  • 0
    Если вы напишите document.getElementById("demo").innerHTML = text внутри цикла, он будет печатать его при каждой итерации, однако это плохо, потому что если у вас много элементов, это будет пустой тратой времени, так что вы сначала нужно построить текст с text+= затем после цикла вывести его.
Показать ещё 17 комментариев

Ещё вопросы

Сообщество Overcoder
Наверх
Меню