javascript相关技术-CSDN博客

2019独角兽企业重金招聘Python工程师标准>>>

1 JavaScript概述

JavaScript是Web上一种功能强大的编程语言，用于开发交互式的web页面。它不需要进行编译，而是直接嵌入在HTML页面中，由浏览器执行。

JavaScript被设计用来向HTML页面添加交互行为。

JavaScript是一种脚本语言(脚本语言是一种轻量级的编程语言)。

JavaScript由数行可执行计算机代码组成。

JavaScript通常被直接嵌入HTML页面。

JavaScript是一种解释性语言(就是说，代码执行不进行预编译)。

1.1 JavaScript的组成

(1)核心(ECMAScript)：语法，语句。

(2)文档对象模型(DOM)：Document Object Model.操作文档中的元素和内容。

(3)浏览器对象模型(BOM)：浏览器对象。

1.2 JavaScript的作用

使用JavaScript添加页面动画效果，提供用户操作体验。主要应用有：嵌入动态文本于HTML页面、对浏览器事件做出响应、读写HTML元素、验证提交数据、检测访客的浏览信息等。

1.3 JavaScript的引入

在HTML文件中引入JavaScript有两种方式，一种是在HTML文档直接嵌入JavaScript脚本，称为内嵌式，另一种是链接外部JavaScript脚本文件，称为外联式。

内嵌式：在HTML文档中，通过<script>标签引入，如下：

//此处为JavaScript代码

</script>

外联式：在HTML文档中，通过<script src=””>标签引入.js文件，如下：

2基本语法

2.1变量

在使用JavaScript时，需要遵循以下命名规范：

必须以字母或下划线开头，中间可以是数字、字符或下划线

变量名不能包含空格等符号

不能使用JavaScript关键字作为变量名，如function

JavaScript严格区分大小写

变量的声明 var 变量名;

//JavaScript变量可以不声明，直接使用。默认值：underfined

变量的赋值 var 变量名=值;

//JavaScript变量是弱类型，及同一个变量可以存放不同类型的数据

2.2数据类型

基本类型

Underfined：Underfined类型只有一个值，即underfined。当声明的变量未初始化时，该变量的默认值是underfined。

Null：只有一个专用值null，表示空，一个占位符。值underfined实际上是从值null派生来的，因此ECMAScript把它们定义为相等的。

alert(null==undefined); //输出”true”，尽管这两个值相等，但它们的含义不同。

Boolean：有两个值true和false。

Number：表示任意数字。

String：字符串由双引号(“)或单引号(‘)声明的。JavaScript没有字符类型

对变量或值调用typeof运算符将返回下列值之一：

underfined---如果变量是Underfined类型的

boolean---如果变量是Boolean类型的

number---如果变量是Number类型的

string---如果变量是String类型的

object---如果变量是一种引用类型或Null类型的

引用类型

引用类型通常叫做类(class)，也就是说，遇到引用值，所处理的就是对象。

JavaScript是基于对象而不是面向对象。对象类型的默认值是null。

JavaScript提供众多预定义引用类型(内置对象)。

2.3运算符

JavaScript运算符与Java运算符基本一致。

注意：==等于，比较的是值是否相同

===全等，比较的是值和类型是否都相同

2.4基本操作

alert() 向页面中弹出一个提示框。

innerHTML 向页面的某个元素中写一段内容，将原有的东西覆盖。

获得document.getElementById(“divId”).innerHTML;

设置document.getElementById(“divId”).innerHTML=”......”;

3定时器

定时器setInterval

window.setInterval(code,millisec); 按照指定的周期(间隔)来执行函数或代码片段

参数1：code必需。执行的函数名或执行的代码字符串。

参数2：millisec必需。时间间隔，单位：毫秒。

返回值：一个可以传递给window.clearInterval()从而取消对code的周期性执行的值。

方式一：函数名，setInterval(show, 100);

方式二：函数字符串，setInterval(“show()”, 100);

clearInterval()取消由setInterval()设置的timeout。

Window对象提供的都是全局函数，调用函数时window可以省略。

setInterval()等效于window.setInterval()

定时器setTimeout

setTimeout()在指定的毫秒数后调用函数或执行代码片段。

setTimeout(code, millisec);

code必需。要调用的函数或要执行的代码字符串。

Millisec必需。在执行代码前需等待的毫秒数。

clearTimeout()取消由setTimeout()方法设置的timeout。

4 BOM(Browser Object Mode)

4.1 Window对象

方法：定时器

函数名	描述
setInterval()	按照指定的周期(以毫秒计)来调用函数或计算表达式
clearInterval()	取消由setInterval()设置的timeout
setTimeout()	在指定的毫秒数后调用函数或计算表达式
clearTimeout()	取消由setTimeout()方法设置的timeout

方法：消息框

函数名	描述
alert()	显示带有一段消息和一个确认按钮的警告框
confirm()	显示带有一段消息以及确认按钮和取消按钮的确认框
prompt()	显示可提示用户输入的提示框

4.2 Location对象

Href属性：设置或返回完整的URL

4.3 History对象

go()方法：跳转到指定页面

go(-1)加载前一个链接，等效back()

go(1)加载后一个链接，等效forword()

5事件

事件名	描述
onload	某个页面或图像被完成加载
onsubmit	提交按钮被点击
onclick	鼠标点击某个对象
ondblclick	鼠标双击某个对象
onblur	元素失去焦点
onfocus	元素获得焦点
onchange	用户改变域的内容
onkeydown	某个键盘的键被按下
onkeypress	某个键盘的键被按下或按住
onkeyup	某个键盘的键被松开
onmousedown	某个鼠标按键被按下
onmouseup	某个鼠标按键被松开
onmouseover	鼠标被移到某元素之上
onmouseout	鼠标从某元素上移开
onmousemove	鼠标被移动