1

哪一个更支持或更优选使用，为什么？

例如：

像这样在 html 标签内内联 javascript：

html: <input type="button" value="click" onclick="doFunction()" />

并像这样调用该函数：

<script type="text/javascript">
   function doFunction()
    {
      alert("Hello World");
    }
</script>

或者只是这样做（使用jquery）：

html: <input type="button" value="click" />

查询：

<script type="text/javascript">
   $(document).ready(function(){
      $("input[type='button']").click(function(){
          alert("Hello World");
      });
   });
</script>

请提供一些与答案相关的文章链接。

谢谢你。

4

2 回答 2

5

最佳做法是将您的关注点分开。html 应该显示显示，而 javascript 应该使其动态化。话虽如此，如果要使用它，我建议让您的 html 以一种简单的方式成为目标

<input id="btnClick" type="button" value="click" />

然后定位该特定元素以供使用

$("#btnClick").click(function(){ alert("click"); });

总体而言，如果您正在制作一个小型网站，则仅在要使用大量功能时才包含 jQuery。如果您只需要使用 jQuery 作为click事件处理程序，那么最好使用计划 javascript 来执行此操作（请注意，在 jquery 中完成的任何事情都可以在 javascript 中完成）

document.getElementById("btnClick").onclick = function(){ alert("click"); };
于 2013-05-16T22:19:13.933 回答
1

最好避免使用内联事件侦听器的一些原因：

  1. 将脚本逻辑与主题/ gui 层分开（正如其他人所说）。
  2. 很难堆叠或命名空间内联事件侦听器。即有多个事件侦听器应用于同一事件。
  3. 内联事件侦听器必须依赖全局命名空间中的变量，因此如果不首先全局公开这些变量，就不可能为事件侦听器使用外部包装的本地范围。例如，您有一个查找/生成多个链接标签的循环，并且您希望应用一个单击侦听器来引用您在包装的本地范围内拥有的变量。使用内联事件是不可能的。
  4. 由于内联代码和节点对象本身之间的循环引用，内联事件侦听器在旧浏览器中更容易出现内存泄漏。我不知道现代用户代理是否仍然如此。
  5. 您无法控制事件何时被捕获，使用 addEventListener 您可以在大多数浏览器中的捕获或冒泡阶段之间进行选择。
  6. 由于标记中的内联事件侦听器是基于文本的（即不基于函数），因此无法将相同的代码应用于许多元素。相反，您必须复制文本，然后将其转换为每个元素的新事件侦听器——浪费资源。
  7. 当元素被移除并重新添加到 Dom 中时，内联事件侦听器可能会出现奇怪的行为。这不是我曾经尝试过的事情，但我会假设事件侦听器属性将在重新插入 dom 时重新评估，这将是不理想的，甚至可能会产生意想不到的结果。
  8. 使用标记中的内联事件侦听器，您无法在实现侦听器之前测试是否支持该事件。在使用正确分离的 javascript 时，您可以if ( typeof elm.ondblclick != 'undefined' ) { ... }在应用侦听器或决定降级为后备之前检查是否属实。您显然可以将所有可能的侦听器实现为标记的一部分，但这可能会产生不良影响。
于 2013-05-16T22:55:38.270 回答