• 关于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. 微信JS-SDK 选取手机照片并进行上传

    项目中遇到需要选取照片上传的需求,因为网页运行在微信的浏览器里面,所以用微信的 js-sdk 提供的选取照片功能,来进行项目开发.实际开发中需要用到微信web开发者工具,详细参考链接:https:// ...

  2. Struts2-045验证脚本

    #! /usr/bin/env python # encoding:utf-8 import urllib2 import sys from poster.encode import multipar ...

  3. mysql的复杂查询,连接数据库

    1.MySQL的工具:Navicat 优点:方便2.数据库的导入 mysqldump -u用户名 -p密码 数据库名称 > 导出文集路径 #结构+数据 mysqldump -u用户名 -p密码 ...

  4. Tarjan算法:求解图的割点与桥(割边)

    简介: 割边和割点的定义仅限于无向图中.我们可以通过定义以蛮力方式求解出无向图的所有割点和割边,但这样的求解方式效率低.Tarjan提出了一种快速求解的方式,通过一次DFS就求解出图中所有的割点和割边 ...

  5. Linux 链接详解----动态链接库

    静态库的缺点: 库函数被包含在每一个运行的进程中,会造成主存的浪费. 目标文件的size过大 每次更新一个模块都需要重新编译,更新困难,使用不方便. 动态库: 是一个目标文件,包含代码和数据,它可以在 ...

  6. 51Nod--1085背包问题

    1085 背包问题 基准时间限制:1 秒 空间限制:131072 KB 分值: 0 难度:基础题  收藏  关注 在N件物品取出若干件放在容量为W的背包里,每件物品的体积为W1,W2--Wn(Wi为整 ...

  7. svn 如果遇到an unversioned directory of the same name already exists的解决办法

    svn 如果遇到an unversioned directory of the same name already exists的解决办法 一般这种情况是因为,在一个已经存在的文件夹里做SVN che ...

  8. MATLAB中最基本函数plot()的用法

    1二维平面图形 1.1基本图形函数 画出一条正弦曲线和一条余弦曲线 1.1.1绘图参数表 y 黄- 实线. 点< 小于号 m 紫: 点线o 圆s 正方形 c 青-. 点划线x 叉号d 菱形 r  ...

  9. C#设计模式之二十策略模式(Stragety Pattern)【行为型】

    一.引言   今天我们开始讲"行为型"设计模式的第七个模式,该模式是[策略模式],英文名称是:Stragety Pattern.在现实生活中,策略模式的例子也非常常见,例如,在一个 ...

  10. Linux权限相关操作命令

    以下是关于创建用户,设置用户密码,以及查看文件权限,给用户设置权限的一系列操作过程. #查看当前用户的信息[root@VM_64_7_centos tmp]# iduid=0(root) gid=0( ...