• 关于JS的概念
  1. JavaScript 是一种弱类型语言。
  2. JavaScript 是一种客户端脚本语言（脚本语言是一种轻量级的编程语言）。
  3. JavaScript是基于对象的。(因为面向对象需要具有封装、继承、多态的特征)
  4. JavaScript是一门解释型的语言，浏览器充当解释器（就是说，代码执行不进行预编译）。
  5. JavaScript执行引擎并不是一行一行的执行，而是一段一段的分析执行。
  • JS的引入与放置位置

1.引入方式一：使用<script>标签,直接在HTML代码里加入JavaScript代码；

2.引入方式二：使用<script src=”XXX.js”>调用外部的JavaScript(.js)文件；

<script src=”js/jquery.js”></script>

注意：外部的.js文件里面直接写js代码，不要在开头和结尾加标签；

3.引入方式三：在html标签的事件中，超级链接里；

<button onclick="javaScript语言"></button>

<a href="javascript:alert('aa');alert('bb')">点击</a>

4.错误方式：调用外部的JavaScript(.js)文件，就不能再在里面写；

<script src=”xxx.js”>

var _name =’张三’；

alert(_name)；

</script>

5.多段script的执行顺序

按引入顺序，逐段执行（思考为什么N多页面吧JS写在最后？）

a.防止页面一次出现，等待时间较长，不符合人的阅读习惯

b.防止js语言已经出现，但是变量在js之后没有在内存中读取，导致js找不到变量发生错误

6.JS代码放的位置：页面head和body都可以写

页面中的脚本会在页面载入浏览器后立即执行，我们并不总希望这样。有时，我们希望当页面载入时执行脚本；而另外的时候，我们则希望当用户触发事件时才执行脚本。

a.把JavaScript代码放到HTML<body>部分

把页面载入时就需要执行的JavaScript代码放到<body>标签之间。这是一种规范，建议这样做。

b.把JavaScript代码放到HTML<head>部分

把当脚本被调用时，或当事件被触发时才会执行的JavaScript代码放到<head>标签之中，这样就可以确保在调用JavaScript之前就载入了它。这是一种规范，建议这样做。

7.如何与老浏览器打交道

那些不支持 JavaScript 的浏览器会把脚本作为页面的内容来显示。为了防止这种情况发生，我们可以使用这样的 HTML 注释标签：

 <html>

 <body>

 <script type="text/javascript">

 <!--//HTML注释

 document.write("Hello World!");//JavaScript代码

 //-->//JavaScript注释

 </script>

 </body>

 </html>

 /*注释行末尾的两个正斜杠是 JavaScript 的注释符号，它会阻止 JavaScript 编译器对这一行的编译.*/
  • JS的语句与注释

(1)JavaScript语句结束符

通常要在每行语句结尾加上一个分号(;)，但是根据JavaScript标准语句结尾的分号是可选的，浏览器会把行末作为语句的结尾。

 <script type="text/javascript">

      document.write("语句1<br>")

      document.write("语句2<br>")

 </script>

(2)JavaScript代码块

JavaScript可以分批的组合起来，使用“{”“}”把多条语句括起来组成代码块。代码块的作用是一并的执行语句序列。

 <script type="text/javascript">

      {

          document.write("<h1>This is a header</h1>");

          document.write("<p>This is a paragraph</p>");

          document.write("<p>This is another paragraph</p>");

      }

 </script>

(3)JavaScript注释

 <script type="text/javascript">

      document.write("JavaScript注释！");//双斜杠表示行注释（第一种）

      /*

      第二种，块注释

      */

 </script>
  • 关于延迟脚本与异步脚本

延迟脚本

HTML4.0.1中定义了defer属性，它的用途是表明脚本在执行时不会影响页面的构造。也就是说，脚本会延迟到整个页面都解析完毕后再执行。 因此，在<script>元素中设置defer属性，相当于告诉浏览器立即下载，但延迟执行。在XHTML文档中，要把defer属性设置为defer=“defer"。

异步脚本

html5为<script>定义了async 属性。整个属性与defer属性类似，都用于改变处理脚本的行为。同样，与defer类似，async只适用于外部脚本文件，并告诉浏览器立即下载文件。 但与defer不同的是，标记为async的脚本并不保证按照指定他们的先后顺序执行。指定async的目的是不让页面等待脚本文件下载和执行，从而异步加载页面其他内容。因此，建议异步脚本不要再加载期间操作DOM。

  • JS与DOM的关系

浏览器有渲染html代码的功能，把html源码在内存里形成一个DOM对象，就是文档对象。浏览器内部有一个JS的解释器/执行器/引擎、如chrome 用V8引擎。我们在html里写一个JS代码，JS代码被引擎所执行，而执行的结果就是对DOM的操作。而对学习DOM操作的结果，就是我们常常看到的特效，比如图片漂浮，文字变色等。学习Javascript要注意：

  1. JS语言本身的语法
  2. DOM对象（把body,div,p等节点树看成一个对象）
  3. BOM对象（把浏览器的地址栏，历史记录，DOM等庄子啊一个对象）
  4. 浏览器是宿主，但JS的宿主不限于浏览器，也可以是服务器端

JavaScript基础1——基本概念的更多相关文章

  1. JavaScript基础知识（概念、常量和变量）

    1.JavaScript概念 JavaScript是脚本语言; 编写之后,可以直接运行(缺失了编译的过程) 2.JavaScript发展 LiveScript    =>    JavaScri ...

  2. JavaScript基础知识-基本概念

    typeof操作符 typeof 操作符返回一个字符串,表示未经计算的操作数的类型. // 数值 typeof 37 === 'number'; typeof 3.14 === 'number'; t ...

  3. 【javascript基础】2、函数

    前言 我在上一篇[javascript基础]基本概念中介绍了javascript的一些基本概念,多谢大家的阅读和意见,自己写的东西可以被大家阅读,真心高兴,刚开始发布的时候我一直盯着阅读人数,虽然知道 ...

  4. 一步步学习javascript基础篇（0）:开篇索引

    索引: 一步步学习javascript基础篇(1):基本概念 一步步学习javascript基础篇(2):作用域和作用域链 一步步学习javascript基础篇(3):Object.Function等 ...

  5. 前端之JavaScript基础

    前端之JavaScript基础 本节内容 JS概述 JS基础语法 JS循环控制 ECMA对象 BOM对象 DOM对象 1. JS概述 1.1. javascript历史 1992年Nombas开发出C ...

  6. 一步步学习javascript基础篇（3）：Object、Function等引用类型

    我们在<一步步学习javascript基础篇(1):基本概念>中简单的介绍了五种基本数据类型Undefined.Null.Boolean.Number和String.今天我们主要介绍下复杂 ...

  7. Javascript基础回顾 之(三) 面向对象

    本来是要继续由浅入深表达式系列最后一篇的,但是最近团队突然就忙起来了,从来没有过的忙!不过喜欢表达式的朋友请放心,已经在写了:) 在工作当中发现大家对Javascript的一些基本原理普遍存在这里或者 ...

  8. Javascript基础回顾 之(一) 类型

    本来是要继续由浅入深表达式系列最后一篇的,但是最近团队突然就忙起来了,从来没有过的忙!不过喜欢表达式的朋友请放心,已经在写了:) 在工作当中发现大家对Javascript的一些基本原理普遍存在这里或者 ...

  9. JavaScript 基础回顾——对象

    JavaScript是基于对象的解释性语言,全部数据都是对象.在 JavaScript 中并没有 class 的概念,但是可以通过对象和类的模拟来实现面向对象编程. 1.对象 在JavaScript中 ...

随机推荐

  1. Java中static关键字的详解

    static关键字可以修饰方法和成员变量(不可以修饰局部变量,但是可以修饰内部类). static关键字方便在没有创建对象的情况下来进行调用(方法/变量). 很显然,被static关键字修饰的方法或者 ...

  2. iOS swift的xcworkspace多项目管理（架构思想）

    iOS  swift的xcworkspace多项目管理(架构思想) 技术说明: 今天在这里分享 swift下的 xcworkspace多项目管理(架构思想),能为我们在开发中带来哪些便捷?能为我们对整 ...

  3. Less的@import指令

    Less的@import指令 Less中,可以通过 @import指令来导入外部文件.@import指令可以放在代码中的任何位置,导入文件时的处理方式取决于文件的扩展名: 如果扩展名是 .css,文件 ...

  4. StringUtils工具类常用方法汇总1(判空、转换、移除、替换、反转)

      Apache commons lang3包下的StringUtils工具类中封装了一些字符串操作的方法,非常实用,使用起来也非常方便.最近自己也经常在项目中使用到了里面的一些方法,在这里将常用的方 ...

  5. 集合、增强for、泛型

    Collection集合:Collection是层次结构中的根接口,存储的元素为对象,(也就是说只能存储引用数据类型,不能存储基础数据类型),具体可查询API.集合与数组的区别:1.集合只能存放引用数 ...

  6. Java IO（2）阻塞式输入输出（BIO）的字节流与字符流

    在上文中<Java IO(1)基础知识——字节与字符>了解到了什么是字节和字符,主要是为了对Java IO中有关字节流和字符流有一个更好的了解. 本文所述的输出输出指的是Java中传统的I ...

  7. ChatterBot之快速入门01

    本人运行环境为Python 3.5.2; 首先你需要导入chatterbot 的包,如果没有你先需要下载 使用命令 pip install chatterbot 1 # -*- coding: utf ...

  8. 360提供的php防注入代码

    <?php //Code By Safe3 function customError($errno, $errstr, $errfile, $errline) { echo "< ...

  9. 使用vee-validate表单插件是如何设置中文提示？

    最近在写vue表单验证的时候,在网上找到一款不错的插件vee-validate,在使用的过程中发现配置不了中文提示,这就很苦恼了,基本上网上的配置办法我都看过,都是有问题的,比如这种 import z ...

  10. 浏览器出现Cannot set property 'onclick' of null的问题

    Part1: 当js文件放在head里面时,如果绑定了onclick事件,就会出现这样的错误, 是因为W3School的写法是浏览器先加载完按钮节点才执行的js,所以当浏览器自顶向下解析时,找不到on ...