• (Frontend Newbie)Web三要素(三)


    上一篇简单介绍了Web三要素中的层叠样式表,本篇主要介绍三要素中最后一个,也是最难掌握的一个-----JavaScript。

    JavaScript

    老规矩不能破,先简要交代 JavaScript 的历史。

    我们知道,在Web诞生之初是没有JavaScript的,网页只是简单的文本。随着Web的发展和逐渐成熟,人们对Web的诉求越来越多,网页的大小和复杂性在不断的增加。在那个网速普遍只有一二十K的年代,用户填完一张表单之后提交到服务端,然后等待几十秒,才能获得服务端返回的验证信息。如果用户的输入有误,那就要不停的重复这个过程。对于用户来说,这是一个痛苦的折磨。于是人们对于表单本地校验的诉求越来越强烈,进而催生了JavaScript语言。
    有趣的是,最初NetScape(网景)公司在开发JavaScript语言的时候(JavaScript诞生于1995年),并没有将其命名为JavaScript,而是叫做LiveScript。在NetScape Navigator 2发布前期,为了搭上当时被媒体热炒的Java语言的顺风车,NetScape公司临时将LiveScript改名为JavaScript。所以,实际上JavaScript与Java语言没有任何实质的关系。
    由于Web的持续发展,用户关注度越来越高,微软公司也加大了对IE浏览器的投入。不久就在IE3中加入了JavaScript的实现,只不过叫做JScript而已。了解Web发展历史(参阅Web简史)的都知道,这个时期正处于第一次浏览器大战时期,各家都在拼命抢占市场份额。因此对于JavaScript,难免各个厂家都会加入不同的实现和特性,最明显的例子就是JavaScript和JScript两个版本并驾齐驱,缺乏一个统一的标准。
    随着业界对这个问题的担心日益加剧,终于在1997年,通过NetScape、Sun、微软等公司的程序员的努力,终于完成了ECMA-262标准的制定。ECMA-262定义了一种叫做ECMAScript的新的脚本语言的标准。随后,各个浏览器厂商以ECMAScript作为各自JavaScript实现的基础,也就是说,目前我们使用的JavaScript,都是ECMAScript的一种具体实现。

    通常我们把JavaScript就当成是ECMAScript,但实际上JavaScript比ECMA-262规定的要多得多。一个完整的JavaScript实现要包含下面三个组成部分。

    1. 核心(ECMAScript)
    2. 文档对象模型(DOM)
    3. 浏览器对象模型(BOM)

    其中,ECMAScript就是我们通常认为的JavaScript语言,包括语法、类型语句、关键字、保留字、操作符、对象等基本的语言要素。
    文档对象模型(Document Object Model),是针对XML但经过扩展用于HTML的API,既然是API,我们就可以通过DOM来操作文档。实际上,DOM把整个页面映射成一个多层节点机构,HTML或XML页面中的每个组成部分都是某种类型的节点,这些节点又包含着不同类型的数据。这里要多问一句,为什么要有dom存在呢,直接操作html文档不可以么?其实早期就是这么做的,IE4和Netscape Navigator 4分别支持不同形式的DHTML(动态HTML),开发人员在此基础上,无需重新加载网页就已经可以修改网页的外观和内容了。那为什么后来又出现了DOM呢?这还是要联想到当时的历史情景,当时正好处于第一次浏览器大战,NetScape和微软在开发DHTML方面各持己见,导致了当时的两大阵营之间的严重不兼容。长久这样下去,对Web的发展是非常不利的,所以此时,W3C才站出来开始着手规划DOM。
    我们在日常的开发过程中要用到很多与浏览器相关的对象,接触最多的一个对象想必就是window对象了,那么window对象是怎么来的呢,它其实属于浏览器对象模型(Browser Object Model)的一部分。我们知道,JavaScript运行在浏览器中(先不说Nodejs),如果要使用浏览器的功能,比如新开一个标签页,就必须通过BOM,这也是BOM产生的原因。BOM提供了很多的对象,用于访问浏览器的功能,除了window对象,还有location对象、navigator对象、screen对象、history对象等。在开发过程中,我们经常要使用到这些对象,所以熟练掌握这些对象是很有必要的。

    小结

    本篇主要介绍了JavaScript的诞生,并介绍了JavaScript的基本组成部分,从整体上了解了JavaScript这门语言。后面会从一些基本的语言点和日常开发中使用频率较高的知识点介绍JavaScript语言的基本知识。

  • 相关阅读:
    分布式爬虫
    前端页面展示
    fillter根据value来匹配字段
    element ui 怎么去修改el-date-picker的时间
    element ui,input框输入时enter健进行搜索
    element ui 里面的table怎么弹出一个框让表中数据点击出现弹框
    修改数据结构记录,将同级数据改成父子集数据
    h5的复制功能的使用,Clipboard.js的使用,主要是在app里面使用
    在安卓手机下按钮会悬浮在键盘上,怎么解决vue.js
    last-child为啥不生效
  • 原文地址:https://www.cnblogs.com/bingooo/p/5094313.html
Copyright © 2020-2023  润新知