js01

回顾

多表映射 xml （一对多，多对多）

注解映射

@Select(“sql语句”)@Update@Insert@Delete

综合案例

今日内容

javascript 工作在浏览器（前端）中，服务器也可以用js写（node js）

ECMAScript v6 （基本语法）（学习特有的）

DOM （操作页面上标签元素的 api）document object model （重点）

BOM（操作浏览器功能的 api）browser object model （了解）

1. 基本语法

方式1：

<script> // 编写 js 代码 /* */ </script>

方式2：

<script src="js文件的路径"></script> <!-- js 代码写在js 文件内 -->

工具 node.js （可以不装）主要是开发服务端js代码

vscode （前端神器）

掌握两个调试方法

console.log(); // 输出到控制台，出了错也要控制台看alert() // 弹警告框

定义变量常量

let 变量名 = 值（还是区分类型的..） const 常量名 = 值

六种基本数据类型

number 小数整数都可以string “hello” ‘hello’ hellobooleannull 和 undefined let a; let b = null;bigint

运算符

== 比较值 "10" == 10 true === 比较类型和值 "10" == 10 false

字符串转数字

let n = "10"; let m = n-0; // 用-0转为数字的10 parseInt("10")

… 展开运算符（了解）

let arr = [1,2,3]; // ...arr ==> 表示拿到了数组内的这些元素，但不包括[] let arr2 = [4,5,6,...arr]; let arr3 = [7,8,9]; let arr4 = [...arr, ...arr3];

数组

.splice(索引, 个数); .push(元素); .pop()

函数

function 函数名(参数名1, ...) { // 参数无需类型声明，返回值不需要声明 // 代码 return 结果; } 函数名(实参1, ...); // 实参个数不必与形参个数相同

注意：js 中函数没有重载！后定义的同名函数会覆盖前面定义的

匿名函数

let fun = function (参数名1, ...) { // 代码 return 结果; }; fun(实参1, ...); // 函数变量

补充

var 变量 = 值; // 不推荐使用

js 中的每行的结束符号; 是可以省略的，但不建议省略

2. dom（*）

文档对象模型 - 操作标签

查找标签

document.getElementById(“id值获取”)标签名，class 名称，name 属性，获取父元素

增删改

createElement(“标签名”)父元素.appendChild(子元素)父元素.removeChild(子元素)

管理属性

获取属性 元素.属性名 或 元素.getAttribute(“属性名”)修改属性 元素.属性名=值 或 元素.setAttribute(“属性名”, “值”)删除属性 元素.removeAttribute(“属性名”)style 代表样式（优先级高） i1.style.display = “none”; // 隐藏i1.style.display = “block”; // 显示 className 代码样式（来自于样式表）

建议使用 innerText ,因为 innerHTML xss 注入攻击

3. 事件 (*)

<标签 οnclick=“函数()”/>

<script> function 函数名() { // 事件发生后要执行的代码 } </script>

<标签 id=“id值”>

<script> document.getElementById("id值").onclick = function() { // 匿名函数方式 // 事件发生后要执行的代码 } </script>