3.21 笔记+心得

最新推荐文章于 2021-08-13 13:48:49 发布

yxbillie

最新推荐文章于 2021-08-13 13:48:49 发布

阅读量177

点赞数

分类专栏：课堂笔记个人心得

本文链接：https://blog.csdn.net/yxbillie/article/details/79647196

版权

课堂笔记同时被 2 个专栏收录

31 篇文章 0 订阅

订阅专栏

个人心得

21 篇文章 0 订阅

订阅专栏

课堂笔记；

1函数内，局部作用域；

函数外，全局作用域；

2.this，指向谁，具体看谁调用这个函数；

3.localStorage.setItem(key,value)：用于将key-value键值对的方式插入localStorage中。

4.localStorage.getItem(key)：读取key的localStorage字符串值。

5.localStorage.removeItem(key)：删除localStorage中key。

6.localStorage.clear()：清空localStorage所有key。

7.在localStorage中只能存储字符串类型的数据。

8.key():在指定的数字位置获取该位置的名字。

案例：利用localStorage防止页面动态添加数据刷新后数据丢失

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title>Document</title>
<script src="https://cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script>
</head>
<body>
<ul>
<li>555</li>
<li>555</li>
<li>555</li>
<li>555</li>
</ul>
<button>button</button>
<script type="text/javascript">
var arrary_li = document.querySelectorAll("li");
var num;

$('button').on('click', function () {
$('li').last().addClass('active')
for (var i = 0; i < arrary_li.length; i++) {
if (arrary_li[i].className === 'active') {
num = i;
}
}
localStorage.setItem('num', num)
location.reload()
})
var getNum = parseInt(localStorage.getItem('num'));
$('li').eq(getNum).addClass('active');
</script>
</body>
</html>