@[toc]
JavaScript
一、数据类型
1.=赋值
2.==等于
3.===绝对等于(一般在JavaScript中使用这个)
4.use strict 严格检查模式(用于检查代码的严谨性)必须写在第一行
5.substring(1) 从第一个截取到最后一个
二、数组
1.var arr=[1,2,4,5]
2.获取数组的长度arr.length
3.indexOf 通过元素获取下标索引
4.slice(4) 截取arry数组中4以后的数据。
5.push()压入数据到尾部
6.pop()弹出尾部的数据
7.unshift()压入到头部数据
8.shift()弹出头部数据
9.sort()元素排序
三、Map和Set集合
3.1.Map
var map=new Map(["admin",10],['tom',12]);
map.get('admin') //通过key值获取到values的值
map.set('jack',45); //添加值
map.delete('tom') //删除key值
2.Set
无序不重复的集合
var set =new Set([1,2,1])
set.add() //添加
set.delete() //删除
set.has() //判断是否包含某一个元素
for in和for of的区别
for(var x in set){
console.log(x); //打印下标
}
for(var x of set){
console.log(x); //打印具体的值
}
四、函数
1.绝对值函数
function abs(x){
return x;
}
arguments 代表传递进来的所有参数是一个数组。
2.rest 参数获取定义之外的参数,并且写在最后面用...标识。
例如
function abs(x,y,...rest){
return x;
}
3.在JavaScript中定义的var变量是有作用域的。
在函数体里面定义的变量在函数体外是无法使用的。
内部函数可以访问外部的成员。
4.let
解决局部作用域冲突的问题
例如
function bbb(){
for(let i=0;i<10;i++){
console.log(i);
}
console.log(i);
}
let 让i只能在函数中打印出i的值,如果是var则在函数体以外也是可以打印出i的值。
一般都使用let定义局部变量
5.count
用于定义一个常量。
6.方法
方法就是函数放在对象里面。对象包含:属性和方法
var sss={
name:'admin',
age:12,
aaa:function(){
//方法
}
}
//获取属性
sss.name
//方法
sss.age()
7.apply
用于方法的指向。通过apply的指向我们可以调用不同的方法
例如
function aaa(){
console.log("你哈");
}
aaa.apply(对象名,传入的参数);
五、内部对象
1.Date
var now= new Date() //获取当前时间
now.getFullYear() //年
now.getMonth() //月
now.getDate() //日
now.getDay() //星期
now.getHours() //时
now.getMinutes() //分
now.getSeconds() //秒
now.getTime() //时间戳
now.toDateString()
2.Json
对象:{
}
数组:[]
键值对:key:values
json与对象之间的转化
例如
var user{
nane:'damin',
age:12
}
对象转化为Json
JSON.stringify(user);
Json转化为对象
JSON.parse()
六、BOM操作
1.window 代表全局属性可以获取窗口的属性
2.screen 获取屏幕的属性
3.location 代表当前的url信息
七 DOM的操作
1.获取Dom节点
<div id="father">
<h1>标题</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 children=father.children; //获取父节点的子节点
father.firstChild;
</script>
2.更新Dom节点
<div id="a1">
</div>
<script>
var a1=document.getElementById('a1');
a1.innerText='123' //插入文本
a1.innerHTML='<h1>456</h1>' //插入代码
a1.style.color='red';
</script>
3.删除Dom节点
<div id="father">
<h1>标题</h1>
<p id="p1">p1</p>
<p class="p2">p2</p>
</div>
<script>
var p1=document.getElementById('p1');
var father= p1.parentElement //获取父节点的元素
father.removeChild(p1); //通过父节点删除子节点
</script>
4.插入Dom节点
## 已存在标签的添加
<p id="p1">p1</p>
<div id="list">
<p id="p2">p2</p>
<p id="p3">p3</p>
</div>
<script>
var p1=document.getElementById('p1') //获取p1节点
var list=document.getElementById('list')
list.appendChild(p1); //将p1追加到了list中
</script>
## 创建节点
var newp=document.createElement('p'); //创建一个标签
newp.id='newp';
newp.innerText='hello'; //标签赋值
list.appendChild(newp); //标签追加
//万能方法
var script=document.createElement('script');
script.setAttribute('type','text/javascript')
八、表单
1.获取表单的值
<div>
<span>username</span><input type="text" name="username" id="username"/>
<span>sex</span>
<input type="radio" value="boy" id="boy"/>男
<input type="radio" value="boy" id="girl">女
</div>
<script type="text/javascript">
var username=document.getElementById('username');
username.value;
username.value='123456';
var boy=document.getElementById('boy');
var girl=document.getElementById('girl');
if(boy.checked){
console.log(boy.value);
}{
console.log(girl.value);
}
</script>
2.表单md5加密
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="http://cdn.bootcss.com/blueimp-md5/1.1.0/js/md5.min.js"></script>
</head>
<body>
<div>
<span>username</span><input type="text" name="username" id="username"/>
<span>sex</span><input type="password" name="pass" id="password"/>
<input type="hidden" id="pwd" name="password">
<button type="submit" onclick="aaa()">submit</button>
</div>
<script type="text/javascript">
function aaa() {
var username=document.getElementById('username');
var password=document.getElementById('pwd');
password.value=md5(pass.value);
}
</script>
九、总结
==工欲善其事,必先利其器。==