链接悬停时交换 div - Firefox 中的 JavaScript 错误

发布于 2024-11-19 11:28:53 字数 620 浏览 2 评论 0原文

我有一些代码,允许我将鼠标悬停在多个链接上,然后替换指定 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

I have some code which allows me to hover over a number of links and subsequently replace the content in a specified DIV. It works in most browsers but Firefox gives an error - the error can be 'fixed' by removing the doctype code for the page, but clearly this means there is a massive problem with the code and it's not compliant.

Here is the Javascript:

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

Each link looks like this, with a different number:

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

And this is the DIV which has its content changed upon hovering on one of the links:

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

The error that Firefox throws up is:

FeatureSwap is not defined

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

遗心遗梦遗幸福 2024-11-26 11:28:53

innerHTML 是 DOM(文档对象模型)元素的属性。

因此,您需要首先获得对该元素的访问权限。在您的例子中,该元素是 id 为 FeatureSwap 的 div。

在下面的代码中,我们首先使用大多数浏览器通用的方法通过元素的 ID 查找元素。然后我们设置它的innerHTML 属性。

尝试

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

仅供参考,通过删除文档类型声明,您导致 Firefox 以 “怪异模式” 显示您的页面比符合标准的模式。 Firefox 中怪异模式的显着特征之一是元素可以可以通过它们的 ID 进行访问,就像它们是变量一样。有关详细信息,请参阅 WHATWG 规范

innerHTML is an attribute of an element of the DOM, the Document Object Model.

So you need to first gain access to the element. In your case, the element is the div with id of FeatureSwap.

In the following code, we first look up the element by its ID using a method that is common to most all browsers. Then we set its innerHTML property.

Try

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

FYI, by removing the doctype declaration you led Firefox to display your page in "quirks mode" rather than the standards-compliant mode. One of the notable features of quirks mode in Firefox is that elements can be accessed by their IDs as if they were variables. For more information see the WHATWG spec.

浸婚纱 2024-11-26 11:28:53

尝试:

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

Try:

<a onMouseOver="document.getElementById('FeatureSwap').innerHTML = description[1];">
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文