为什么使用"javascript: <code>"不好？

可能重复：
您是否需要在onclick中指定javascript:？

要在DOM事件上执行JavaScript，可以使用以下内容：

<div onclick="alert('Alert');">Alert</div>

像这样的东西似乎也起作用：

<div onclick="javascript: alert('Alert');">Alert</div>

然而，我听说第二个例子是"坏"的，应该用第一个例子代替第二个。

这不好吗？如果是这样的话，为什么会如此糟糕？alert('Alert')和javascript: alert('Alert')之间有什么区别？

在<a>标签中使用它（如果有任何不同的话）怎么样？

<a href="javascript: alert('Alert');">Alert</a>

编辑：为了澄清，我询问的是javascript:部分，而不是如何将内联JavaScript与标记混合在一起。很抱歉造成混乱。

_{哦，JavaScript的奇妙而令人困惑的世界。你发布的代码可能没有达到大多数程序员认为的效果}

以下每一行之间都有差异：

<a onclick="alert('Hello World!')"...>example</a> //V1
<a href="javascript: alert('Hello World!')"...>example</a> //V2
<a onclick="javascript: alert('Hello World')"...>example</a> //V3

尽管它们都将提醒CCD_ 5。

第一个（V1）具有通过[onclick]属性绑定的内联click事件。它还可能包含一个[href]属性，该属性在[onclick]属性执行后导航到另一个位置，或者代码中绑定的任何数量的其他click事件，假设默认行为没有被阻止。

第二个（V2）具有被设置为[href]属性的可执行javascript:url。它还可能包含绑定在外部脚本中的[onclick]属性或其他click事件。

第一个和第二个例子（V1&V2）执行了相同的代码，即：

alert('Hello World!')

第三个示例（V3）有一个通过[onclick]属性绑定的内联click事件，就像V1一样，但是执行的代码不同。执行的代码是：

javascript: alert('Hello World')

虽然它看起来像javascript: url，但实际上它只是在javascript中使用了一个标签。

JavaScript中的标签对于跳过嵌套循环非常有用，如以下示例代码所示：

label: for (i = 0; i < 5; i++) { //labeled line
    for (j = 0; j < 5; j++) {
        console.log(i, j);
        if (i === 2 && j === 3) {
            break label; //this jumps out of both for loops
        }
    }
}

在大多数内联JavaScript中，它被误用是因为作者不理解这三种格式之间的区别。

为什么使用javascript: <code>不好？

这是一个主要问题。它假设使用javascript: <code>是错误的。

javascript: <code>还不错。这是一个工具。工具本身并没有好坏之分，只有使用工具的人才是。即使有人把锤子当作武器，你也不会说它"坏"。

CCD_ 21有一些不错的用途。在大多数情况下，你不应该使用它，因为它是一个错误的工具，但如果你正在写一个bookmarklet，你需要使用javascript: <code>格式。

此外，在一些小众上下文中，让javascript内联是有意义的。一个例子是在页面上添加一个简单的print按钮：

<a href="#" onclick="window.print(); return false">Print</a>

尽管即使是这个例子也可以很容易地被一个类和外部化javascript:所取代

<a href="#" class="print">Print</a>
<script>
     //jQuery used for brevity
     $(document).on('click', '.print', function () {
         window.print();
         return false;
     });
</script>

使用javascript:标签并没有真正的问题。大多数时候，它只是被认为是糟糕的风格。

一个onclick处理程序已经是JavaScript了，所以重复它只是毫无意义的冗余信息（事实上，它通过添加一个名为javascript的标签来改变执行的代码——但在大多数情况下，这不应该有任何效果）
href属性中的JavaScript代码将更合适地放置在onclick处理程序中，因此可以使用href为禁用JavaScript的用户提供链接。这被称为渐进增强

有关更多详细信息，您可能想看看这篇关于"无用的javascript:pudo-protocol"

的精彩博客文章

相关内容

最新更新

热门标签：