内联JS的缺点

Question

我想知道这一段实际上是什么意思？

它是从一个网站采取缺点约内嵌脚本

交通不便：当涉及到内嵌的JavaScript代码，如在 上面的例子中，它适用于不具备的元素任何 内置后备交互处理

链接：https://robertnyman.com/2008/11/20/why-inline-css-and-javascript-code-is-such-a-bad-thing/

Answer 1

<div style="width: 800px; margin: 1em auto; font: bold 1em/1.2 Verdana, Arial, Helvetica, sans-serif"> 
    <div style="float: left; width: 400px; padding: 1em 2em; font-size: 0.9em"> 
     <span id="get-shit" onclick="callSomeFunction()">News</span> 
    </div> 
</div> 

他说，在上面的函数，如果callSomeFunction，重定向页面以一些其他的网页...但由于某种原因（由于网络错误无法加载）callSomeFunction未在页面加载，那么这将是一个死链接，将什么也不做，所以而是应该以这样的方式，如果没有的JavaScript也应该合理工作实施...

即使浏览器提供了一个配置为禁用javascript的用户，所以在上面的链接这种情况下，不会做任何事

因此，他说，通过使用下面的代码，

<link rel="stylesheet" href="css/base.css" type="text/css" media="screen"> 
<script type="text/javascript" src="js/base.js"></script> 

<div id="container"> 
    <div id="navigation"> 
     <a id="get-news" href="news-proper-url">News</a> 
    </div> 
</div> 


/* 
    CSS code, in separate file (base.css) 
*/ 
#container { 
    width: 800px; 
    margin: 1em auto: 
    font: bold 1em/1.2 Verdana, Arial, Helvetica, sans-serif; 
} 

#navigation { 
    float: left; 
    width: 400px; 
    padding: 1em 2em; 
    font-size: 0.9em; 
} 

/* 
    JavaScript code, in separate file (base.js) 
*/ 
window.onload = function() { 
    document.getElementById("get-news").onclick = function() { 
     // Get news through AJAX 
    }; 
} 

这里，如果未加载JavaScript，然后再点击“新闻”将为您重定向到新的页面，

如果JavaScript加载，然后他会送一个AJAX请求，并在同一个页面加载新闻

这些都对JavaScript的不可用的情况下，在同一个页面

不每个人都有的JavaScript目前上市？

第一：不，他们没有。其次：有些人故意关闭它（对于 实例，NoScript Firefox扩展至今已有3100万次下载 ）。第三，通常不是最终用户，但是他们不控制的外部环境，这会导致某些 程度或其他，导致JavaScript不可用。这些因素 是：

防病毒程序和防火墙在其 JavaScript安全判断中有点过于苛刻。公司代理服务器过滤出 代码（例如，阅读关于AJAX和 可访问性的重要教训）。其他公司互联网访问设置阻止 正确的JavaScript执行。

Answer 2

举例在逐步增强

<a href="important-message.html" onclick="alert('Important message'); return false;">Click me</a> 

这里，如果JavaScript失败，那么链接将正常工作，重要的消息通过从服务器加载新页面显示。

（如JavaScript是成功的点击默认行为，将被取消，该链接不会跟随）。

内置的链接的交互处理程序“去URL”。通过在上分层JavaScript ，我们可以使用它作为后备。

例无渐进增强

<button type="button" onclick="alert('Important message');">Click me</a> 

在这里，如果JavaScript的失败，则什么也不会发生的。这只是一个不做任何事情的按钮。

---

这实际上并没有任何关系，JavaScript与内联。从脚本元素加载的现代JavaScript会发生同样的问题，并且会与addEventListener绑定。