document.getElementById (element) .innerText = variable

Question

Я пытаюсь написать цикл, чтобы улучшить способ назначения значений элементам html на веб-странице.

на данный момент я использую ....

document.getElementById("Season201516Score1").innerHTML = Game201516Score1; 
document.getElementById("Season201516Score2").innerHTML = Game201516Score2; 
document.getElementById("Season201516Score3").innerHTML = Game201516Score3; 

и так далее ....

Переменные

var Game201516Score1= "L 0-2" 
var Game201516Score2= "W 1-0" 
var Game201516Score3= "D 2-2" 

Петля я использую это

for (var i = 1; i <= 3; ++i) 
{ 
element = 'Season201516Score' + i 
Score = ('Game201516Score' + i) 
document.getElementById(element).innerText = Score; 
} 

Он работает до сих пор, что он ставит текст в правильных элементах на странице, а не значения «L 0-2», «W 1-0» или «D 2-2» в тексте «Game201516Score1», «Game201516Score2» и «Game201516Score3».

Может кто-нибудь показать мне, что я делаю неправильно.

Answer 1

Score = ('Game201516Score' + i) 

является строкой, а не переменной. Таким образом, вы назначаете эту строку, а не переменную в html. Вам нужно преобразовать строку в переменную, чтобы иметь возможность использовать ее в первую очередь. Если это глобальная переменная, то window[Score] должен дать правильный ответ вместо использования только показателя. Кроме того, вы также можете использовать this[Score].

Answer 2

Можете ли вы сохранить оценки в массиве? Что-то вроде этого -

var Game201516Score = []; 
Game201516Score[0]= "L 0-2" 
Game201516Score[1]= "W 1-0" 
Game201516Score[2]= "D 2-2" 

for (var i = 0; i < 3; i++) 
{ 
    element = 'Season201516Score' + i 
    document.getElementById(element).innerText = Game201516Score[i]; 
} 

Answer 3

eval: Изменить линию Score = ('Game201516Score' + i); на Score = eval('Game201516Score' + i);.

окно: Если eval не работает для вас, то попробуйте это для выше линии Score = window["Game201516Score" + i];;

Надеюсь, что все будет хорошо!

Answer 4

Первое, что вы должны сделать, это положить переменные где-то явно - с помощью var это в текущей области, что вполне возможно, window но это может зависеть (например, если этот код на самом деле в функции)

window.myScores.Game201516Score1= "L 0-2" 
window.myScores.Game201516Score2= "W 1-0" 
window.myScores.Game201516Score3= "D 2-2" 

Тогда ваш другой кусок кода будет использовать квадратный кронштейн обозначение, чтобы получить доступ к этим переменному

for (var i = 1; i <= 3; ++i) 
{ 
    element = 'Season201516Score' + i 
    Score = window.myScores['Game201516Score' + i]; 
    document.getElementById(element).innerText = Score; 
}