Javascript 函数 - 可能有什么问题？答案

【问题标题】：Javascript functions - what could be wrong?Javascript 函数 - 可能有什么问题？
【发布时间】：2013-01-26 03:48:06
【问题描述】：

我有一些使用可编译语言的经验，但我是 Javascript 的新手，它真的让我很困惑。所以可能我通常做错了什么，但我不知道它是什么。

一个代码示例（不工作）：

function show_element(element_name){
    document.getElementsByName(element_name)[0].style.display="";
}
function hide_element(element_name){
    document.getElementsByName(element_name)[0].style.display="none";
}
function switch_display(element_to_hide, element_to_show){
    hide_element(element_to_hide);
    show_element(element_to_show);          
}

HTML 代码如下所示：

<area shape="rect" coords="0,252,98,337" onMouseOver="switch_display("content_navigator_1","content_navigator_2")">

在 Firefox 中进行调试时 onMouseOver 会出现错误消息：

syntax error: switch_display (

谢谢你帮助我！

（次要问题：您是否也遇到过 Javascript 的问题？它真的是一种逻辑语言，还是只是一种试错语言？为了好，有没有 JS 编译器？）

【问题讨论】：

现在是 2013 年。为什么要像 1999 年那样编写 JavaScript？
那么2013年你会怎么写呢？ :-)
@Marcus，使用纯 js 没什么问题，只需将 ..byName 替换为 ..byId 并使用 id 而不是名称来定位 html 元素。
@Marcus jQuery 是一切的解决方案
@ajax333221 - jQuery 不是万能的解决方案。

标签： javascript function variables compiler-construction

【解决方案1】：

您的具体错误在这里（您还有其他问题，请参阅我的回答底部）

<area shape="rect" coords="0,252,98,337" onMouseOver="switch_display("content_navigator_1","content_navigator_2")">

切换到

<area shape="rect" coords="0,252,98,337" onMouseOver="switch_display('content_navigator_1','content_navigator_2')">

如果我需要解释原因，请告诉我。

除了你的错误原因之外，还有一个问题是你尝试通过名称调用 HTML 元素，最好是通过 id 来调用，然后使用：

document.getElementById(element_id).style.display="";

【讨论】：

我只想补充：IE 6 完全理解 document.getElementsByName(...)[0] 为 document.getElementById(...)。因此，如果您调用类似 document.getElementsByName(...)[0].innerHTML="";仅当您定义 id 时，这在 IE 中才有效！很奇怪的行为，可能这个问题即使在较新版本的IE中也存在，我到目前为止没有检查。所以你是对的，如果我们因为IE需要定义一个id，最好只使用id。 ;D

【解决方案2】：

尝试在参数周围使用单引号。双引号终止属性值。

<area shape="rect" coords="0,252,98,337" onMouseOver="switch_display('content_navigator_1','content_navigator_2')">

【讨论】：

【解决方案3】：

随手试试

<area shape="rect" coords="0,252,98,337" onMouseOver="switch_display('content_navigator_1','content_navigator_2')">

或正确地转义内部引号。

【讨论】：

【解决方案4】：

.getElementByName()返回一个元素列表，所以需要使用索引：

document.getElementByName(element_name)[0].style.display = "none";

但是，正如其他人建议的那样，您应该使用getElementById()

【讨论】：

这根本不是问题。问题在于 HTML (onMouseOver="switch_display(") 中的 " 字符。
我仍然需要感谢你，因为那是我的另一个错误。在线教程太糟糕了。但是，现在它终于运行了。 ;D