定时器
/* document.getElementById('guangao').style.display = 'block' */
// setTimeout(function(){
// document.getElementById('guangao').style.display = 'none'
// },3000)
/* 过个一段时间去做一件事 */
/* 定时器 */
/* 定时器会返回一个唯一的id */
// let id = setInterval(function(){
// console.log('我爱js<br>');
// console.log(id);
// },1000)
// /* 根据定时器返回的唯一的id 来清除定时器 */
// function clearfn(){
// clearInterval(id)
// }
/* 过一秒钟 在控制台上打印出 一个数字 比如1
再过一秒钟 打印出2 ....
点击清除定时器 终止打印 */
// let i = 0;
// let id = setInterval(function () {
// i++;
// console.log(i);
// }, 1000)
// function clearfn() {
// clearInterval(id)
// }
/* setTimeout 和 setInterval的区别是
setTimeout只执行一次 */
/* 也会产生一个唯一的id标识 */
/* let id = setTimeout(function (){
console.log('我说冷笑话');
},1000) */
缓存
<button onclick="fn2()">显示sessionStorage中name的值</button> -->
<button onclick="fn1()">设置localStorage</button>
<button onclick="fn2()">显示localStorage的值</button>
<script>
/* sessionStorage 存储之后 页面刷新 缓存的值不会消失
但是 把tab页 或者叫 会话 关闭之后,缓存的值就不存在了 */
// function fn1(){
// /* setItem设置 存储 */
// /* sessionStorage.setItem('name','zhangsan') */
// sessionStorage.name = 'zhangsan';
// }
// function fn2(){
// /* getItem获取 */
// // let v = sessionStorage.getItem('name');
// // document.write(v);
// document.write(sessionStorage.name);
// }
/* 设置和取值 使用两种方式都试一下 */
/* 点击按钮 设置一个学生信息 学号 stuNo 语文成绩 chinese
存到sessionStorage缓存中,再点击按钮 可以在页面显示出学生的学号
和语文成绩 ,最后把tab关闭,再次打开页面看值之后还存在 */
// function fn1(){
// // sessionStorage.stuNo = '1908'
// // sessionStorage.chinese = '90'
// sessionStorage.setItem('stuNo','1099')
// sessionStorage.setItem('chinese','80')
// }
// function fn2(){
// // document.write(sessionStorage.stuNo);
// // document.write(sessionStorage.chinese);
// document.write(sessionStorage.getItem('stuNo'));
// document.write(sessionStorage.getItem('chinese'));
// }
/* localStorage会一致存储在本地,会话或者tab页关闭也不会消失 */
/* localStorage是和地址有关系的,地址改变了,localStorage里面的值就不存在了
前面地址没有发生改变的话,localStorage依然存在 ,虽然页面改变了*/
function fn1(){
/* localStorage.setItem('car','bmw') */
localStorage.car = 'bc'
}
function fn2(){
/* document.write(localStorage.getItem('car')); */
document.write(localStorage.car);
}
/* 在页面A 本地存储 一个username 到本地 使用两种方式 存储
再新建一个页面B 在A页面中点击一个a 链接 跳转到 B页面
,看能否取到username 取值也使用两种方式
都在本地打开 使用 open in default brower */
</script>
bom
语法、变量和数据类型、运算符、逻辑控制语句、关键字、保留字、对象
编码遵循ECMAScript标准 -->
<script>
/*
BOM:Browser Object Model(浏览器对象模型)
提供了独立于内容与浏览器窗口进行交互的对象
*/
/* window.prompt('输入一个数') */
/* console.log(window);
window.alert(1) */
/* 确认框 window.confirm() 用于验证是否接受用户操作 */
/* let flag = confirm('你是最强王者吗');
alert(flag) */
/* 你是一个好学生吗?
如果是 就alert出 继续加油
如果不是 就alert出 我还要努力 */
// if( confirm('你是一个好学生吗?') ){
// alert('继续加油')
// }else{
// alert('我还要努力')
// }
/* prompt的第二个参数是默认值 */
// let v = prompt('今天你快乐吗','快乐')
// alert(v)
/* 这个是地址的参数信息 */
// console.log(window.location.search);
// /* 这是地址路径 */
// console.log(window.location.href)
// /* 这个是地址的端口 */
// console.log(window.location.port)
/* 后退 */
function back() {
/* window.history.back(); */
/* 两者的作用一致 都是后退 */
window.history.go(-1);
}
/* 前进 */
function forward(){
/* window.history.forward(); */
window.history.go(1)
}
/* 刷新 */
function go(){
/* go里面是没有任何参数的 */
/* window.history.go(); */
/* 两者功能相等 都是刷新 */
/* window.history.go(0); */
/* 这个也表示刷新 */
location.reload();
}
/* 写个 前进 和后退 和刷新 的按钮 使用不同的方式 */
</script>