Поменять местами div при наведении ссылки - ошибка JavaScript в Firefox

Question

У меня есть некоторый код, который позволяет мне наводить курсор на несколько ссылок и впоследствии заменять контент в указанном DIV.Он работает в большинстве браузеров, но Firefox выдает ошибку - эту ошибку можно «исправить», удалив код типа документа для страницы, но, очевидно, это означает, что существует огромная проблема с кодом, и он не совместим.

Вот Javascript:

var description = new Array();
description[0] = "Content one";
description[1] = "Content two";
description[2] = "Content three";

Каждая ссылка выглядит следующим образом, с другим номером:

<a onMouseOver="FeatureSwap.innerHTML = description[1];">

И это DIV, содержание которого изменяется при наведении на одну изссылки:

<div id="FeatureSwap">Default content here</div>

Ошибка, которую выдает Firefox:

FeatureSwap is not defined

Answer 1

innerHTML является атрибутом элемента DOM, объектной модели документа.

Поэтому вам необходимо сначала получить доступ к элементу.В вашем случае это элемент div с идентификатором FeatureSwap.

В следующем коде мы сначала ищем элемент по его идентификатору, используя метод, который является общим для большинства браузеров.Затем мы устанавливаем его свойство innerHTML.

Попробуйте

<a onMouseOver="document.getElementById('FeatureSwap').innerHTML = description[1];">

---

FYI, удалив объявление doctype, которое заставляло Firefox отображать вашу страницу в "режиме причуд" а не режим, соответствующий стандартам.Одна из заметных особенностей режима причуд в Firefox заключается в том, что элементы могут быть доступны по их идентификаторам, как если бы они были переменными.Для получения дополнительной информации см. WHATWG spec .

Answer 2

Попробуйте:

<a onMouseOver="document.getElementById('FeatureSwap').innerHTML = description[1];">