5、内部对象
Date 日期的对象
Json 对象
- 对象都用{}
- 数组都用[]
- 所有键值对 都是用 key:value
JSON.stringify()讲对象转化为字符串
JSON.parse()解析字符串变为对象
6、面向对象编程
6.1 什么是面向对象
JavaScript,Java,c# 面向对象
JavaScript有些区别
-
类:模板
-
对象:具体实例
在JavaScript这个需要换一下思维方式
原型:__ proto __
ES6有class,和java一样 本质是原型
7、操作BOM对象(重点)
浏览器的介绍
JavaScript和浏览器的关系?
JavaScript诞生就是为了让他在浏览器中运行
BOM:浏览器对象模型
- IE6~11
- Chrome
- Safari
- Firefox
- Opera
三方
- QQ浏览器
- 360浏览器
可以安装内核
window
window代表浏览器窗口
Navigator
Navigator 封装了浏览器的信息
screen
代表屏幕尺寸
location
location代表当前页面的URL信息
history
history.back()//后退
history.forward()//前进
8、操作DOM(重点)
DOM:文档对象模型
核心
- 更新:更新Dom节点
- 变量Dom节点:得到Dom节点
- 删除:删除一个Dom节点
- 添加:添加一个Dom节点
<div id="father">
<h1>标题1</h1>
<p id="p1">p1</p>
<p class="p2">p2</p>
</div>
<script>
//对应选择器
var h1 = document.getElementsByTagName('h1');
var p1 = document.getElementById('p1');
var p2 = document.getElementsByClassName('p2');
var father = document.getElementById('father');
var childs = father.children;//获取父节点的所有子节点
</script>
更新节点
var p1 = document.getElementById('p1');
p1.innerText="123";
p1.innerHTML='<strong>123</strong>';
p1.style.color='yellow';
删除节点
先获取父节点,再删除自己
var self = document.getElementById('p1');
var father = p1.parentElement;
father.removeChild(self)
插入节点
var list = document.getElementById('p1');
list.appendChild(js)
insertBefore(newNode,TargetNode)
新建节点
var NP = document.CreateElement('p');
NP.id = 'NP1';//或者 NP.setAttribute('id','NP1');
NP.innerText="123";
list.appendChild(NP)
9、操作表单(验证)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.bootcss.com/blueimp-md5/2.10.0/js/md5.min.js"></script>
</head>
<body>
<form action="https://www.baidu.com/" method="post" id="user" onsubmit="return aaa()">
<p>
<span>用户名:</span><input type="text" id="username" name="username">
</p>
<p>
<span>密码:</span><input type="password" id="password">
</p>
<input type="hidden" id="md5-password" name="password">
<button type="submit">提交</button>
</form>
<script>
function aaa() {
alert(1);
var username = document.getElementById('username');
var pwd = document.getElementById('password');
var mpwd = document.getElementById('md5-password');
mpwd.value=md5(pwd.value);
return true;
}
</script>
</body>
</html>