百度前端技术学院是一个为大学生创办的免费的前端技术实践、分享、交流平台。由百度校园招聘组、百度校园品牌部、百度前端技术部以及多个百度的前端团队联合创办。学院组织了一批百度在职工程师,精心编写了数十个实践编码任务,将技术知识点系统有机地串联在各个充满趣味与挑战的任务中,同学们通过实际地编码练习来掌握知识,再辅以互相评价、学习笔记等方式,加深对于学习内容的理解。在过去的三年中,百度前端技术学院累积吸引了上万名同学参加,并且有数十名同学在学习后,顺利加入了百度,成为了百度的前端工程师。

js前瞻

作者欧阳志强课程第十六天,开始感受JS的乐趣715次浏览12018-05-12 17:37

JavaScript的出现

  • 简单的历史背景

    • JavaScript语言本身是为了解决90年代初期,差网速条件下的表单验证而生。这么说可能不够形象,我举个例子:在90年初的某一个晚上,你看到某个论坛的内容十分吸引人,然后点击了注册,输入了信息后有个提交,点击提交,接下来的半分钟甚至1~2分钟内,你都将看到的时候那个永无休止的圆圈再转!那是多么的痛苦!那时的表单验证就是这样,52kb的网速,加上往返的验证、request等等,如果是现在,估计10秒的不响应你都会刷新重来,或者认为网络、网页出了问题!因此,Netscape Navigation公司组织研发了livescript脚本语言应对此问题,又恰逢当时编程语言的爆发,Java语言同时期更早一点发布,Netscape Navigation公司匆忙地将livescript脚本语言发布,并搭上Java语言的热潮改名为Javascript语言,实际两者并没有什么关系!至此还有很多人在交流时这样说
      "你学的什么语言啊?""javascript""你学的Java啊!""/晕"!可谓这个顺风车搭的非常有效果!
    • 虽然JavaScript的开发非常成功,但是迫于那个浏览器动荡的时代,JavaScript也不得不想ECMA求助,终于,在92年期间,以JavaScript1.1版本向ECMA提交建议,开发出一套通用的、跨品台供应商中立的标准脚本语言。次年,ISO/IEC等也采取了ECMA的js标准。至此,ECMAScript诞生,所以所说的js不是js,js又是js,JavaScript和ECMAscript互相包容,互相依赖,用一文读懂JavaScript和ECMAscript的区别上的一句话来说:
ECMAScript 是基于 JavaScript 的,而同时 JavaScript 又是基于ECMAScript 的。
就像是一个人穿越变成了自己的父母一样——有点矛盾,不过想起来还是挺搞笑的。
  • JavaScript的实现

    • 说来JavaScript还是一门服务于浏览器和网页的脚本语言,而一个完整的JavaScript语言的实现由以下三个不同的部分组成。
      • 核心(ECMAsrcipt);
      • 文档对象模型(DOM);
      • 浏览器对象模型(BOM);
    • 一门标准的JavaScript语言规定了哪些内容呢?
      • 语法
      • 类型
      • 语句
      • 关键字
      • 保留字
      • 操作符
      • 对象
  • DOM级别
    • DOM2:DOM视图、DOM事件、DOM样式、DOM遍历和范围
    • DOM3:新增了DOM验证方法、开放支持XML(我觉得将来有一天真的有可能会将HTML发展成XML,并得到良好支持!)
  • 浏览器对象模型(BOM)

    • 弹出窗口功能
    • 移动缩放和关闭浏览器功能
    • 提供浏览器详细信息的navigation对象
    • 提供浏览器加载页面详细信息的locating对象
    • 提供用户显示器分辨率详细的screen对象
    • 对cookies的支持
    • 类似xmlhttp Request和IE的action Xobject
    • 这样的自定义对象

      JavaScript基础

  • script元素引用

    • 在<head>头部等文档位置引用
        <script type="text/javascript" src="js/javacript.js"></scrit>
      
    • 在文档内任意元素间插入小块脚本
        <script>
            function fun(){
                console.log("hello world!")
            }
        <script>
      
  • 使用文档内js脚本和引用脚本时应该注意的地方
    • 加载顺序
      文档流默认从上至下加载,如果js放在head头部,那么网页在加载之前要先等待js脚本加载并执行完毕后才能加载后面body的内容或者后面的其他内容,显然这样会影响网页的内容加载速度!
    • <script></script>标签匹配原则里,默认<script>标签会匹配最近的</script>标签,如下,第一个<script>标签会匹配alert里的那个</script>标签,故引起报错:
        <script>
                function fun(){
                    alert("</script>")
                }
        <script>
      
      解决办法就是转移" ",或者用转移字符串:
        <script>
                function fun(){
                    alert("</script>")
                }
        <script>
      
      如这样代替:
代码 输出
' 单引号
" 双引号
& 和、与
反斜杠
n 换行符
r 回车符
t 制表符
b 退格符
f 换页符

或者用实体参考:去这里查看完整版

非常抱歉的地方

  • 因为对于图床概念的疏忽,导致上传的笔记图片都会出现失效问题,但是CSND里的博客都是没有问题的,问题就在于其他博客网站对于用户的图片访问权限设置会造成其他用户访问时反馈403错误,所以,我正在努力用图床替换所有笔记的图片地址,大家如果看到什么不正常的地方,请移步我的CSDN博客:会飞的小鹿,上面有完整的图片解释!抱歉!!!
1条评论