javaweb——javascript学习笔记

JavaScript

1. 输出

1.1 JavaScript使用数据

window.alert() //弹出警告框
document.writer() //方法将内容写到HTML文档中
innerHTML //写入到HTML元素
console.log() //写入到浏览器的控制台

1.2 操作HTML元素

document.getElementByld(id) //使用“id”属性来标识HTML元素，用innerHTML来获取或插入元素内容

<p id="demo">我的第一个段落。</p>
<script>
document.getElementById("demo").innerHTML="段落已修改。";
</script>
//document.getElementById("demo") 是使用 id 属性来查找 HTML 元素的 JavaScript 代码 。
//innerHTML = "段落已修改。" 是用于修改元素的 HTML 内容(innerHTML)的 JavaScript 代码。

document.writer()

<button onclick="myFunction()">点我</button>
<script>
function myFunction() {
    document.write(Date());//Date()当前时间
}
</script>
//在文档已完成加载后执行 document.write，整个 HTML 页面将被覆盖。

2. 语法

2.1 字面量

一般固定值被称为字面量。
数字（number）：整数、小数、科学计数
字符串（string）：可使用单引号或双引号
数组（Array）：定义一个数组
对象（Object）：定义一个对象
函数（Function）：定义一个函数
表达式：用于计算

var length = 16;                                  // Number 通过数字字面量赋值
var points = x * 10;                              // Number 通过表达式字面量赋值
var lastName = "Johnson";                         // String 通过字符串字面量赋值
var cars = ["Saab", "Volvo", "BMW"];              // Array  通过数组字面量赋值
var person = {firstName:"John", lastName:"Doe"};  // Object 通过对象字面量赋值

2.2 变量

2.2.1 用途

变量用于存储数据值。

2.2.2 定义

JavaScript使用关键字 var 来定义变量， 使用等号来为变量赋值。

2.2.3 声明

通过关键字new声明其类型

var carname=new String;
var x=      new Number;
var y=      new Boolean;
var cars=   new Array;
var person= new Object;

2.2.4 数组

var cars=new Array();
cars[0]="Saab";
cars[1]="Volvo";
cars[2]="BMW";

等价于

var cars=new Array("Saab","Volvo","BMW");

2.3 注释

单行注释：//
多行注释：/* */

3. 数据类型

3.1 值类型和引用数据类型

值类型(基本类型)：字符串（String）、数字(Number)、布尔(Boolean)、对空（Null）、未定义（Undefined）、Symbol。
引用数据类型：对象(Object)、数组(Array)、函数(Function)。

3.2 动态类型

JavaScript 拥有动态类型。这意味着相同的变量可用作不同的类型

4. 对象

4.1 定义

对象由花括号分隔。在括号内部，对象的属性以名称和值对的形式 (name : value) 来定义。属性由逗号分隔

var person={
firstname : "John",
lastname  : "Doe",
id        :  5566
};

等价于

var person={firstname:"John", lastname:"Doe", id:5566};

寻址方式：

name=person.lastname;
name=person["lastname"];
//document.write(person.lastname + "<br>");
//document.write(person["lastname"] + "<br>");

4.2 访问对象方法

methodName : function() { code lines }//创建对象方法
objectName.methodName()//访问对象方法
/*var person = {
    firstName: "John",
    lastName : "Doe",
    id : 5566,
    fullName : function() 
	{
       return this.firstName + " " + this.lastName;
    }
};
document.getElementById("demo").innerHTML = person.fullName();*/

5. 表单验证

代码	作用
document.forms	表示获取当前页面的所有表单
document.forms[0]	表示获取当前页面的第一个表单
document.forms[‘exportServlet’]	表示获取当前页面的name="exportServlet"的表单
document.forms[‘exportServlet’].username.value	获取表单为exportServlet，name为exportServlet的值
document.forms[0].submit	表示提交第一个form表单