如何说服我的老板（和其他开发人员）使用/考虑不引人注目的JavaScript

我在develepors团队中很新。

我需要一些强有力的论据和/或“陷阱”示例，因此我的老板将最终了解Unobtrusive JavaScript的优势，以便他和团队中的其他成员停止这样做：

<input type="button" class="bow-chicka-wow-wow" 
       onclick="send_some_ajax(); return false;" value="click me..." />

和

<script type="text/javascript">

function send_some_ajax()
{
  // bunch of code ... BUT using jQuery !!!
}
</script>

我建议使用一种非常常见的模式：

<button id="ajaxer" type="button">click me...</button>

和

<script type="text/javascript">

// since #ajaxer is also delivered via ajax, I bind events to document 
//  -> not the best practice but it's not the point....

$(document).on('click', '#ajaxer', function(ev) {
var $elem = $(this);
ev.preventDefault();

});

我的老板（和其他人）不想使用此方法的原因是FireBug（或Chrome开发工具）中的事件检查不再简单了，例如

<input type="text" name="somename" id="someid" onchange="performChange()">

他可以立即查看在变更事件上执行的功能，并在一个充满意大利面条代码的巨大JS文件中直接跳转到该功能。

对于Unobtrusive JavaScript，他唯一会看到的是：

<input type="text" name="somename" id="someid" />

他不知道某些事件（如果有）是否绑定到该元素，以及哪个函数将被触发。

我在寻找解决方案并找到了它：

$(document).data('events') // or .. $(document).data('events').click

但是，这种“方法”导致它花费了“太长的时间...”来找出哪个函数在哪个事件上触发，所以我被告知停止这样的绑定事件。

我想问您一些示例或强大的优势，或“为什么我们应该使用UJS”的其他建议

更新：建议“换工作”不是理想的解决方案。

更新2：好的，我不仅建议使用jQuery事件绑定，还这样做了。在我写完所有事件委托之后，老板来找我，为什么我要用他不知道的方法来做事件委托？

我提到了一些明显的好处，例如-有15个输入字段，并且所有输入字段都有一个onchange事件（不仅其中一些还具有一个事件onkeyup），因此为所有输入字段编写这种事件委托类更为实用，而不是执行15次，特别是如果所有HTML都将用PHP的echo呈现->echo '... <input type="text" id="someid" ... />...'

1. 停止使用流行语，并尝试使用强有力的论点。甚至在Unobtrusive JavaScript的Wikipedia页面上也没有正式定义该术语。这可能是许多好主意的总称，但是如果听起来只是一种时尚或时尚，那么您的老板和同事就不会在意。更糟糕的是，如果您继续进行他们认为无用的事情，他们可能会开始反对您提倡的完全无关的想法。

2. 弄清楚为什么您认为不干扰JavaScript的想法很重要。是否因为您读过它们被认为是最佳实践？您是否遇到了可归因于不遵循这些想法的问题？采用这些想法会对公司的底线有多大影响？

3. 进入老板的头脑。他为什么以他的方式做事，为什么他拒绝了您的更改？他可能并不傻，而且他的经验可能比您还老，所以他可能有一些很好的理由以自己的方式做事。您已经提到了其中一些-遵循该线程到最后。然后找出您的建议是否以及如何改善他最关心的问题。

4. 提示1：经理喜欢钱。您越直接将建议与增加收入或减少支出联系起来，您的论点就会产生更大的影响。提示2：时间就是金钱。提示3：就其本身而言，代码的美学吸引力无法赚钱。相反，实际上-花一些时间使代码看起来不错。效果很好的丑陋代码对大多数管理人员来说都很好。

5. 不要只是谈论它，而是去做。如果您很幸运能有一个小型的独立项目，请问您的经理是否可以使用“ UJS”风格作为演示。当您准备就绪时，请进行代码审查，在其中可以解释它们的全部工作原理以及为什么您认为它比当前样式更好。

6. 理想主义是伟大的，但不要让它成为障碍。被视为完成工作的人比抱怨抱怨粗俗的编码风格的外来者更重要。如果您是新手，则尤其如此。如果您现在无法使用UJS吸引别人，请改做一些不错的工作，然后慢慢地为获得信誉的情况下要进行的更改构建案例。

7. 阅读开关：如何在困难改变时改变事物。它会为您提供有关如何有效构建案例的更多好主意。

您可以做的就是给他们一个使用FireQuery和Chrome Query工具调试USJ html的演示。

FireQuery是Firebug扩展，在此方面做得很好。至于Chrome Query，我不能保证它有多少好处，但肯定会被某些开发人员使用（stackoverflow上的帖子）。

还应该知道，.data从jQuery 1.8.0开始，该函数已被删除以返回内部事件数据，并且$._data(element, "events")根据官方changelog的替换，该函数可能不稳定。

现在在1.8中已将其删除，但是您仍然可以通过$ ._ data（element，“ events”）获取事件数据以进行调试。请注意，这不是受支持的公共接口。实际的数据结构可能因版本而异。

更新：
当我开始工作时，我遇到了同样的难题。但是，在创建具有全功能GUI（单页应用程序）的演示时，该演示包括动态打开的选项卡（也可关闭），手风琴菜单（从db动态创建），他们最终了解到，最好一直使用USJ。

使用USJ的好处还在于，您可以将整个应用程序缩小为一个小的（不可读的）脚本。还向他们展示google.com / github.com的脚本（作为示例），并指出，即使他们正在压缩代码，也总是更好，因为网站的查看者将很难理解安全漏洞并利用它们对您的网站发起全面的攻击（吓care他们），尽管这种可能性很小。

更新2：
顺便说一句，直到我看到这个问题，我才知道自己正在做USJ，所以以一种方式表示感谢。

内联事件处理程序很臭，因为：

• 没有事件委托-当您希望能够动态地将元素撕入和移出页面而无需重新绑定时，这非常有用。

• 您已将行为绑定到HTML标签，而不是HTML标签的class / ID属性。假设您在整个应用中都有一类“ combo_box”。突然，在一半的旧页面上，当组合框位于不同的容器中时，您希望它们稍有变化。绑定到一个类，您可以基于容器上下文更改该行为，例如"#special_container .combo_box"。绑定在该死的HTML中，您可能会发现自己在任意数量的页面中都使用.combo_box类跟踪了每个小的选择框，以逐一更改这些处理程序引用，而无需进行调整或编写几行新代码以从单个文件位置进行过滤。

• 如果需要多个处理程序，请将它们包装在一个函数中，然后将其不必要地绑定到特定的HTML文件。它的可维护性如何？

• 一个更妙的观点是，以更多的控制面板心态来处理行为要容易得多/更易于维护/灵活且健壮。通过从中心位置进行绑定，您可以找到一个页面，同时查看所有在页面上同时发生的所有行为，这很方便，例如，当您需要弄清为什么某些页面偶尔运行时变成某些难以理解的错误，而其他错误则无法理解。

• 这是客户端。我们有多个浏览器都以各自的方式来解释复杂性。将所有内容放在一起，让IDE为您整理思路在这里效果不佳。保持代码紧密，最少，松散耦合和整洁并不是什么时尚的事，这对于建立易于修改和更新的可维护前端是绝对必要的，是的，这是$$$$$$$$$$$$$$ s $$$$$$$$$ s $$$$$ s $$$$$$$$$$$ s} $$$$$} $$$$$$$$$$$$$$$$$$$$$} $$$$$$$$$$$$$$$$$$$$$$$$$$} $$$$$$$$$$$$$}的定义，这是$$$$$$$$$$$$$$$$$} $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$} $$$$$$$$$$$$$$$$$$}的费用是$$$$$$$$$$$$$$$$$$$$$$$$$$（$$$）的$$$$$假设您的经理确实有远见。

• 不再是2002年的@@ $$ ing。此参数与表格一样古老。克服它，并开始信任您自己雇用的经验丰富的客户端专业开发人员，因为您缺乏他们的专业知识（并不是我正在传播个人经验或其他任何愤怒）。

为了反驳老板的论点，使用CTRL + F跟踪事件委托或处理程序绑定中使用的类或ID确实很困难，并且该工具可以让您像自己的个人jquery一样查看页面上的所有JS。仅用于/ prototype的bookmarklet版本，当Web开发工具栏开始对我不利时（拼凑的颜色编码），我急忙拼凑而成。在js小提琴页面的链接上添加书签，或复制JS并自己制作。

JS小提琴链接可能最终会终止

建议的技术的一个主要优点是，您只需要将事件处理程序绑定到诸如“文档”之类的父级事件，该处理程序就可以捕获来自满足给定选择器的所有子级（例如“ button.anyclass”）的事件。 ”。节省内存和可维护性，从而只需要一个编辑实例，它会影响所有元素。

关于无法立即识别绑定的功能，您的团队可能可以在页面的最下端标准化一种声明此类功能的方法。因此大家都知道在哪里看，命名约定也非常重要，注释会带来巨大的好处，但是在将其用作浏览器响应之前，请确保服务器已将其剥离。

另外，如果出于安全目的要提供JavaScript的混淆和最小化功能，那么您的技术将使其成为可能，这与您的团队仍在使用的旧样式不同。

显而易见的答案是，您只能使用onclick属性将一个功能绑定到您的按钮，而JQuery事件允许您绑定多个功能。onload事件的一个常见问题：如果您的文档由多个文件组成，则经常会发生冲突。

另一种可能令您和您的老板满意的解决方案是使用数据绑定，并使用Knockout或Angular之类的库，它可以跟踪您视图上的修改并抑制对大部分事件处理程序的需求。