一、需求
在一个页面中有一个列表，每个列表项对应另一个页面的内容，操作当前页面的列表项，另一个页面的相应内容被删除。
二、分析
在操作页面，记录被操作的列表项，传入localStorage中。在内容页面，取出localStorage中的数据，然后根据操作页面传递过来的值进行删除操作
<!--操作页面-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
</head>
<body>
<li key="l1">1</li>
<li key="l2">2</li>
<li key="l3">3</li>
<a href="http://localhost:8080/forll/list.html">返回list</a>
<script>
var lis = document.querySelectorAll('li');
var arr = JSON.parse(localStorage.getItem('keys')) || [] ;
for(var i = 0 ;i<lis.length;i++){
var li = lis[i];
li.onclick = function(){
for(var i = 0 ; i<arr.length;i++){
if(this.getAttribute('key') == arr[i] ){
return;
}
}
arr.push(this.getAttribute('key'));
localStorage.setItem('keys',JSON.stringify(arr));
}
}
</script>
</body>
</html>
----------------------------------------------------------------------------------------------------------------------------------------------------------------
<!--要删除的内容页面-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
</head>
<body>
<ul>
<li key="l1">1</li>
<li key="l2" >2</li>
<li key="l3" >3</li>
<li key="l4">4</li>
<li key="l5">5</li>
</ul>
<a href="./delete.html">返回delete</a>
<script>
var lis = document.getElementsByTagName('li');
function deleteChoosedLi(keys){
for(var i = 0 ; i < lis.length ;i++){
for(var j = 0 ; j < keys.length ;j++){
if(lis[i].getAttribute('key') == keys[j]){
lis[i].parentNode.removeChild(lis[i]);
}
}
}
}
var keys = JSON.parse(localStorage.getItem('keys'));
deleteChoosedLi(keys);
</script>
</body>
</html>