js介绍

JavaScript （是什么？）

是一种运行在客户端（浏览器）的编程语言，实现人机交互效果。
作用（做什么？）

网页特效 (监听用户的一些行为让网页作出对应的反馈)

表单验证 (针对表单数据的合法性进行判断)

数据交互 (获取后台的数据, 渲染到前端)

服务端编程 (node.js)

1.书写位置-内部 JavaScript

直接写在html文件里，用script标签包住规范：script标签写在body结束标签上面
在html文件内使用script标签包裹起来，页面打开自动执行。（使用方便，但是大篇幅的JS代码千万不要用。）

1.1 注意事项

我们将 script 放在HTML文件的底部附近的原因是浏览器会按照代码在文件中的顺序加载 HTML。如果先加载的 JavaScript 期望修改其下方的 HTML，那么它可能由于 HTML 尚未被加载而失效。因此，将 JavaScript 代码放在 HTML页面的底部附近通常是最好的策略。

1.2 JavaScript 标签放置位置

一、在咱们编写代码的时候，会在页面内使用script标签来写JS，虽然理论上script标签的位置放在哪里能够，可是仍是有一点区别的。javascript

二、为何不少人把script标签放在底部：html

　　初学者在学习JS的时候看见不少DEMO里面的script标签写在底部，可是却不是很清楚为何，下面来解释一下：前端

　　虽然理论上放在哪里都是能够的，可是对于前端页面优化来说，仍是放在底部是最佳的，由于若是JS执行出现错误了，最起码页面中的元素还能加载出来，由于DOM文档是从上往下的顺序执行的。

三、script标签在body标签内仍是外：浏览器

　　许多人认为只要放在底部了，不管是“body标签闭合以前”仍是在“body标签闭合以后”都是同样的，其实仍是有差异的，由于从HTML 2.0起放在“body标签闭合以后”就是不合标准的。之因此可是浏览器却不会报错，是由于若是在“body标签闭合以后”后再出现script或任何元素的开始标签，都是parse error，浏览器会忽略以前的body，即使做仍旧在body内。因此实际效果和写在“body标签闭合以前”以前是没有区别的。学习

　　因此，只要是让浏览器做了多余的事都是很差的，虽然差异细微，可是仍是应该按照标准来，放在“body标签闭合以前”。

2.书写位置-外部 JavaScript

代码写在以.js结尾的文件里语法 : 通过script标签src属性，引入到html页面中。
引入之后的script标签中间无需写代码，否则会被忽略！
外链的script标签，原则上来说可以放在任何位置。外链的script属性为src，不是href，不是href，不是href…
如果通过外链式导入的.js文件,并且需要在js.文件中操作界面上的元素,那么 scrip 标签必须在 body 结束标签的上面,如果不是 body 结束标签的上面可以通过在.js 文件加上 window.onload (默认情况下浏览器会从上往下的解析网页)
外部JavaScript会使代码更加有序，更易于复用，且没有了脚本的混合，HTML 也会更加易读，因此这是个好的习惯。

内嵌和外链

内嵌和外链不能共用一个script标签

3.书写位置-行内 JavaScript

不推荐直接JavaScript代码书写到标签内部
在html标签的属性内,通过行为触发执行.（几乎不用）
html中行内调用function的时候,是通过window调用的function，所以打印this等于打印window，所以在使用行内注册事件时务必传入参数this

<!DOCTYPE html>  
 <html>  
 <head lang="en">  
 <meta charset="UTF-8">  
  <title></title>  
 <style>  
  .wrong {  
  border: 2px solid red;  
  }
  
  .right {  
  border: 2px solid #91B81D; 
  }
 </style>  
  </head>  

  <body>  
  账号：<input type="text" name="name" value="" **onblur="fn(this)"** /><br /><br />  

  密码：<input type="text" name="name" value="" **onblur="fn(this)"** />  

  <script>  

  function fn(ele) {  

  if (ele.value.length < 6 || ele.value.length > 12) {  

  ele.className = "wrong";  

  } else {  

  ele.className = "right";  

  }  
  </script>  

 </body>  

 </html>

js 介绍-书写位置-语法细节 初级基础篇