javaScript:脚本语言,最初是为了实现在客户端进行的表单验证以减少服务器的数据交互次数,如今可用在页面交互,计算,拥有了闭包,匿名(拉姆达)函数,甚至元编程等特性。

javaScript实现的组成:

  1.核心(ECMAScript)--TC39负责完成的新脚本的语言标准。

  2.文档对象模型(DOM)--针对XML但经过扩展用于HTML的API,DOM把整个页面为一个多层节点结构。

  3.浏览器对象模型(BOM)--控制浏览器显示页面以外的部分。BOM无标准遵循。

javaScript的基本使用:

  向html页面插入javaScript的方法即使用<script>标签,<script>标签的6大属型如下

async  可选,表示应该立即下载该脚本,但不妨碍页面的其他操作。只对外部脚本有效
charset  可选,通过src指定字符集,由于大多数用户代理会忽略这个值,所以基本不用这个属性
defer 可选,表示脚本需要等到文档完全被解析和显示之后再执行,只对外部脚本有效
language  已废弃
src 可选,指定外部文件的路径  
type 可选,类似language,表示编写代码使用的脚本语言的内容类型(MIME),默认为text/javascript

一个简单的示例

  

<script type="text/javascript">
function re(){
alert("hello javascript");
}
</script>

  script标签内的js代码会被自上向下的解释,如上,解释器会解释一个函数的定义,然后将该定义保存在自己的环境中,在解释器对<script>标签内的所有代码求值完毕以前,页面中的其余部分不会被浏览器加载或者显示。

  *script标签在结束前不能出现</sciprt>,但是可以使用转义字符<\/script>来实现。

  外部js,对使用src属性的script标签,不允许在其中嵌入js代码,如果这样,则嵌入的代码会被忽略,只运行src加载的外部js。

  对于外部js,只要没有async,defer属性,则js在按照页面中出现的先后顺序顺序解析,就是第一个js解析完成后,再解析第二个。

  标签的位置

  传统做法:放在html的head元素中,这样的做法意味着浏览器必须等到所有的js代码下载,解析,执行后才能呈现页面的内容(浏览器遇到body标签才开始呈现内容),这将会导致页面在js为准备完毕前处于空白状态,没有良好的用户体验。

  为了避免上述问题,现在一般将script放在</body>之前,页面内容之后。

  再回到上面讲的defer属性,当defer的值为defer时,即为一个延迟脚本,顾名思义,该脚本会立即被下载,但延迟到浏览器遇到</html>时才被解析和执行,当存在多个延迟脚本时,文档中的延迟脚本按照出现的先后顺序解析与执行,但这些脚本会先与DOMContentLoaded事件执行。

  现在来说异步脚本,async="async",异步,即在下载该脚本的同时,不用影响其他操作,如下载其他脚本,但是对于多个异步脚本,并非像defet一样按照顺序执行,另外对于异步脚本,最好不要加载其间修改DOM,异步一定会在页面的load事件之前执行,但可能会在DOMContentLoaded事件触发之前或者之后执行。

  混杂模式:也叫怪异模式,即在WEB发展的早期,各浏览器厂商比较封闭,使用自己的体系,毫无兼容性可言,此时的网站多为混杂模式,当标准推行之后,便出现了标准模式。

  <noscript>标签,实现不支持javascript的浏览器的平稳退化,其出现位置是作为body的相邻兄弟元素,在<script>标签之前闭合。

  
  

  

javaScript入门1--组成,基本使用的更多相关文章

  1. JavaScript入门篇 编程练习

    编程挑战 一.定义"改变颜色"的函数 提示: obj.style.color obj.style.backgroundColor 二.定义"改变宽高"的函数 提 ...

  2. JavaScript入门

    本篇内容是学习慕课网相关课程后,总结出可能未来会忘记的内容 (一)JavaScript入门操作 1.js代码插入位置,以及执行顺序 <head> <script type=" ...

  3. 慕课网JavaScript入门篇课程笔记

    1.js注释很重要 单行注释,在注释内容前加符号 “//”. <script type="text/javascript"> document.write(" ...

  4. JavaScript入门基础

    JavaScript基本语法 1.运算符 运算符就是完成操作的一系列符号,它有七类: 赋值运算符(=,+=,-=,*=,/=,%=,<<=,>>=,|=,&=).算术运 ...

  5. JavaScript入门介绍(二)

    JavaScript入门介绍 [函数] 函数function 是Javascript的基础模块单元,用于代码的复用.信息影藏和组合调用. function a(){} 函数对象Function Lit ...

  6. JavaScript入门介绍(一)

    JavaScript入门介绍 [经常使用的调试工具][w3school.com.cn在线编辑] [Chrome浏览器 开发调试工具]按F121.代码后台输出调试:console.log("t ...

  7. 开心菜鸟系列----函数作用域(javascript入门篇)

      1 <!DOCTYPE html>   2 <html>   3 <script src="./jquery-1.7.2.js"></ ...

  8. 开心菜鸟系列----变量的解读(javascript入门篇)

                       console.info(         console.info(window['weiwu'])          console.info(window. ...

  9. javascript入门视频第一天 小案例制作 零基础开始学习javascript

    JavaScript 是我们网页设计师必备的技能之一.我们主要用javascript来写的是网页特效.我们从零基础开始学习javascript入门. 但是,好的同学刚开始不知道怎么学习,接触js,因此 ...

  10. ArcGIS API for JavaScript 入门教程[0] 目录

    随时翻看. 转载注明出处,博客园/CSDN/B站:秋意正寒. Part 1 必看 ArcGIS API for JavaScript 入门教程[1] 渊源 你还真不一定知道这是啥.非得学吗? ArcG ...

随机推荐

  1. Hadoop-Map/Reduce实现实现倒排索引

    先来简单介绍一下什么是文档倒排索引 倒排索引是文档检索系统中最常见的数据结构,被广泛应用在全文搜索引擎上.主要用来存储某个单词(或词组)在一个文档或者一组文档中的存储位置的映射,即提供了一种根据内容来 ...

  2. Hadoop 2.6.0 POM.xml

    <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/20 ...

  3. Windows Azure中的配置管理

    最近一直在做项目迁移的工作,由传统的ASP.NET转到Windows Azure,这里介绍一下Azure的配置管理.在传统的WinForm或ASP.NET项目下,配置文件为web.config(app ...

  4. pku3668 Game of Lines

    http://poj.org/problem?id=3668 水题,STL #include <stdio.h> #include <set> using namespace ...

  5. 解开发者之痛:中国移动MySQL数据库优化最佳实践(转)

    开源数据库MySQL比较容易碰到性能瓶颈,为此经常需要对MySQL数据库进行优化,而MySQL数据库优化需要运维DBA与相关开发共同参与,其中MySQL参数及服务器配置优化主要由运维DBA完成,开发则 ...

  6. ProtoBuffer 简单例子

    最近学了一下protobuf,写了一个简单的例子,如下: person.proto文件 message Person{ required string name = 1; required int32 ...

  7. 宏_CRTIMP分析

    CRTIMP是C run time implement的简写,C运行库的实现的意思. 作为用户代码,不应该使用这个东西. 该参数决定 运行时 到底用 动态链接库 还是静态链接 #ifndef _CRT ...

  8. HTTP协议状态码详解

    HTTP状态码,我都是现查现用. 我以前记得几个常用的状态码,比如200,302,304,404, 503. 一般来说我也只需要了解这些常用的状态码就可以了.  如果是做AJAX,REST,网络爬虫, ...

  9. viPlugin安装破解

    viPlugin是一个eclipse 针对vi的插件,使用此插件可以让你在使用eclipse进行编码时使用几乎所有vi命令,可以极大的提高开发编码效率.  安装  点击你的eclipse中的 help ...

  10. 织梦dedecms后台添加图片style全部都变成st<x>yle的解决办法

    可乐站长在建站的时候,上传缩略图喜欢输入图片路径,不喜欢上传图片,有几次我上传图片路径为:/style/image/**.jpg,然后返回修改后,图片为路径却为:/st<x>yle/ima ...