突兀和不突兀的 javascript 之间有什么区别 - 纯英语。简洁是值得赞赏的。简短的例子也很受欢迎。
引人注目和不引人注目的javascript之间的区别
我不再认可它,因为它在 2011 年有效,但可能不会在 2018 年及以后有效。
关注点分离。你的 HTML 和 CSS 没有绑定到你的 JS 代码中。您的 JS 代码未内联到某些 HTML 元素。你的代码没有一个大功能(或非功能)。你有简短的功能。
module化的。 当您正确分离关注点时,就会发生这种情况。例如,您出色的画布动画不需要知道向量如何工作才能绘制一个框。
如果他们没有安装 JavaScript,或者没有运行最新的浏览器,请不要扼杀体验——尽你所能优雅地降低体验。
当您只需要做一些小事时,不要构建大量无用的代码。人们通过重新选择 DOM 元素、弄乱语义 HTML 并在其中抛出编号 ID 以及其他奇怪的事情,因为他们不了解文档模型或其他一些技术而不断地使他们的代码复杂化——所以他们依赖“神奇”的抽象层将一切降低到垃圾速度并带来大量开销。
标记中没有 javascript 是不引人注目的:
突兀的:
<div onclick="alert('obstrusive')">Information</div>
不显眼:
<div id="informationHeader">Information</div>
window.informationHeader.addEventListener('click', (e) => alert('unobstrusive'))
扩展迈克的回答:“稍后”添加使用 UJS 行为。
<div id="info">Information</div>
... etc ...
// In an included JS file etc, jQueryish.
$(function() {
$("#info").click(function() { alert("unobtrusive!"); }
});
UJS 也可能意味着温和的退化(我最喜欢的那种),例如,另一种获得#info
点击功能的方法,也许是通过提供等效的链接。换句话说,如果没有 JavaScript,或者我正在使用屏幕阅读器等,会发生什么?
unobtrusive - “不引人注目;不显眼、不自信或沉默寡言。”
突兀的-“具有或表现出突兀的倾向,例如将自己或自己的观点强加于他人。”
obtrude - “将(某物)向前或推向某人,尤其是在没有保证或邀请的情况下”
所以,说到强加自己的意见,在我看来,不显眼的 JavaScript 最重要的部分是从用户的角度来看它不会妨碍。也就是说,如果浏览器设置关闭了 JavaScript,该站点仍然可以工作。无论是否打开 JavaScript,使用屏幕阅读器、键盘和鼠标以及其他辅助工具的人仍然可以访问该站点。也许(可能)该网站对这些用户来说不会那么“花哨”,但它仍然可以工作。
如果您从“渐进式增强”的角度考虑,您网站的核心功能将适用于每个人,无论他们如何访问它。然后,对于启用了 JavaScript 和 CSS 的用户(大多数用户),您可以使用更多交互元素对其进行增强。
另一个关键的“不显眼”因素是“关注点分离”——程序员关心的东西,而不是用户,但它可以帮助阻止 JavaScript 方面的事情突显用户体验。从程序员的角度来看,避免内联脚本确实会使标记更漂亮,更易于维护。调试不分散在一堆内联事件处理程序中的脚本通常要容易得多。