Hrefs vs JavaScript onclick（关于Unobtrusive JavaScript）

Question

关于使用链接/＆lt; a＆gt;的最佳做法是什么？带有显式hrefs到你网站中其他页面的标签（即href =“/ blah / blah / blah.html）vs hrefs / divs / etc。没有明确的href并且在文档就绪处理程序中设置了onclick使用JavaScript来说一个main.js文件。

我在网络开发方面不是专家，但我很高兴学习jQuery等，并发现自己订阅了Unobtrusive JavaScript的概念。虽然上面的两个选项都没有打破“HTML中没有JavaScript”这一心态的一部分，但我想我已经挂断了“从行为中分离结构和表达”。虽然我认为放一个＆lt; a＆gt;更自然。在那里标记并显式设置href，我发现自己认为这是真正的行为，因此应该在JS中设置。

那是远远的，还是我不习惯呢？我的另一面看到了把它放在JS中的好处，b / c现在我有能力完全控制该链接的行为，而不必改变HTML中的任何内容。我想你会说我在众所周知的围栏上。请帮助我失望。 =）

（一个注意事项：该网站大量使用JavaScript，因此关闭提供JS功能的概念并不是真正的问题，因为如果没有它，大多数网站将无法运行。）

Answer 1

由于种种原因，这真的太过分了。

1. 这是一个棘手的代码，应该避免使用。
2. 它不会给您的网站带来任何实际好处。
3. no-js没有雄辩的后备。
4. 它对SEO有负面影响。具体来说，机器人不会运行您的脚本，因此不会看到链接，并最终不正确地索引您的网站。
5. 可能最重要的是，这种影响会严重影响屏幕阅读器或禁用JS的用户的UX（例如，许多手机浏览器禁用JS）

最后，除非你明确需要打破模式（例如传统支持），否则你应该尽量遵循不引人注目的设计，这在你使用JavaScript创建静态结构的意义上是非常突兀的，用HTML完成的事情要好得多。

Answer 2

普通用户不会真正了解其中的差异。但是，如果您希望蜘蛛遵循它们，搜索引擎和搜索引擎优化实践将要求您使用href =“”链接到其他页面。如果访问者使用某些屏幕阅读器或具有一些特殊的可访问性需求，则相同。其中许多人阅读的是源代码，而不是DOM。

通常，如果要链接到页面和操作，请使用href。

如果您需要附加其他功能或不真正转到其他页面或操作，请使用javascript onclick样式，或使用jQuery附加事件。

Answer 3

链接不行为 - 它们代表一个文档与另一个文档之间的链接。当您单击链接时，Web浏览器提供导航到链接页面的行为，但这是浏览器的行为，并且每个浏览器都有自己的约定，以便最好地执行此操作 - 例如，主要单击可能会打开当前页面选项卡，中间单击可能会在新选项卡中打开，M4可能会在新页面中打开该链接。用行为替换这些原始信息会破坏浏览器提供这种选择的能力。

还有其他客户也会受到影响。蜘蛛和其他漫游器将读取您的页面以获取锚标记中的信息，以确定页面链接到的内容。如果您改为使用“行为”，那么您将从页面中删除这些有意义的信息。

Answer 4

同意其他海报。我想补充一点，如果href是静态的 - 即该页面上的交互不会改变它的值 - 那么你可以认为它是页面“结构和表示”的一部分。在不寻常的情况下，它是动态的，并且页面上的某些操作会改变它的值 - 那就是当它变成“行为”时 - 只有这样才能让JS处理它。

另一方面，如果现有代码已经有9个动态设置的hrefs而你只是添加了一个静态href，那么我可能会按照之前开发人员的主要内容来提高可读性。

Answer 5

jquery历史插件非常好，它允许你设置href ='＃/ url“这样你就可以拥有真正的网址，真正的后退按钮，但你的玩家只需要监听绑定到history.url的事件。

http://tkyk.github.com/jquery-history-plugin/

对于有屏幕阅读器的视障用户，不使用标签可能也会产生某种可用性问题。