Основная проблема InnerHTML - PullRequest
Новая
       50

Основная проблема InnerHTML

1 голос
/ 11 марта 2011

это фрагмент кода, который я использую в цикле для добавления элемента HTML во всплывающее окно расширения Google Chrome (.html):

  • ' wordlist 'это массив слов.
  • ' rand ' - функция генерации случайных чисел.

Код: 

for (l=1; l<11; l++) { 
    var i = rand(wordlist.length;
    var h1 = document.createElement("h1");  
    h1.innerHTML = wordlist[i];
    document.body.appendChild(h1);
}

Нет существующих элементов HTML,Итак, этот код добавляет 10 случайных слов на пустую страницу.

Теперь вместо слов, добавляемых на страницу, я хочу добавить ссылки на страницу (например: http://dictionary.reference.com/browse/**wordlist[i]**, что по сутизапрос dictionary.com для этого конкретного слова).Кроме того, я хочу, чтобы эта ссылка открывалась в новой вкладке Chrome при нажатии.Как мне это сделать?

PS : я начал изучать HTML и JS за день до этого и был слишком взволнован, чтобы начать писать какой-то код.Я прошу прощения, если я упустил простое Google решение моей проблемы.Спасибо за ваше время.

Ответы [ 4 ]

2 голосов
/ 11 марта 2011

Если вы хотите работать с DOM, 

for (l=1; l<11; l++) { 
    var i = rand(wordlist.length;
    var a = document.createElement("a");
    a.href = "http://dictionary.reference.com/browse/" + wordlist[i];
    a.appendChild(document.createTextElement(wordlist[i]));
    document.body.appendChild(h1);
}

Это будет быстрее, так как вы добавите HTML только один раз (а операции DOM будут дорогостоящими): 

var html = "";
for (l=1; l<11; l++) { 
    var i = rand(wordlist.length);
    html += "<a href='http://dictionary.reference.com/browse/" + wordlist[i] + "'>"
                + wordlist[i]
          + "</a>";
}
document.body.innerHTML += html;
2 голосов
/ 11 марта 2011 
for (l=1; l<11; l++) { 
    var i = rand(wordlist.length);
    var a = document.createElement("a");  
    a.setAttribute('href', 'http://dictionary.reference.com/browse/'.wordlist[i]);
    a.setAttribute('target', '_blank');
    h1.innerHTML = wordlist[i];
    document.body.appendChild(a);
}

В основном просто измените h1 на a.
Также установите атрибут href (ссылка) и target (где он должен быть openend).

1 голос
/ 11 марта 2011

Попробуйте изменить код на следующее: 

for (l=1; l<11; l++) { 
  var i = rand(wordlist.length);
  var a = document.createElement("a");  
  a.innerHTML = wordlist[i];
  a.href = "http://dictionary.reference.com/browse/" + wordlist[i];
  document.body.appendChild(a);
}

Я исправил проблему в строке 2, вы бы пропустили закрывающую скобку. Я также более очевидно изменил ваш h1 на a, и добавил строку, которая устанавливает его href.

0 голосов
/ 11 марта 2011

Это так же просто, как изменить 

 h1.innerHTML = wordlist[i];

на то, что вам нужно, а именно: 

 h1.innerHTML = "<a href='http://dictionary.reference.com/browse/"+wordlist[i]+"' target='_blank'>"+wordlist[i]+"</a>";

Чтобы открыть его на новой вкладке, вы должны добавить атрибут«цель» и дать ему значение пустым.Я думаю, что это устарело в HTML 5, хотя ...

...