Coding Coffee产品页的like功能

<html><head><meta charset="UTF-8"><title>CODING COFFEE</title><style type="text/css">h1{color: blue;font-size: 60px;}hr{width: 60%;border: 2px dashed #eee;}div{text-align: center;}.content-wrapper{width:750px;margin:0 auto;}.img{float:left;}.para{float:right;width:50%;}</style></head><body><div><h1>CODING COFFEE MENU</h1><hr></div><div class="content-wrapper" onClick="like(this)"><div class="img"><img src="./img/c7.jpg"></div><div class="para"><h2 id="lanshan">蓝山咖啡</h2><p>源自三地的咖啡豆，为周年纪念综合咖啡豆带来了特别的馥郁醇厚。如今推出三种不同包装，让你用自己喜爱的方式体验这别具风味的一杯。</p></div><div style="clear:both;"></div></div><hr><div class="content-wrapper" onClick="like(this)"><div class="img"><img src="./img/c8.jpg"></div><div class="para"><h2 id="natie">拿铁咖啡</h2><p>作为在中国上市的第一款单一产地系列咖啡，东帝汶塔塔迈劳咖啡豆将当地的风味浓缩其中，一起来星巴克门店，感受它那平衡的草本风味吧。</p></div><div style="clear:both;"></div></div><hr><div class="content-wrapper" onClick="like(this)"><div class="img"><img src="./img/c3.jpg"></div><div class="para"><h2 id="yishi">意式浓缩</h2><p>每一款臻选咖啡豆，都有着自己的个性和故事。它因人因地因天气而有着别样的风味。当你来到星巴克臻选门店，这场相遇才刚开始。和我们的黑围裙大师一起，用不同煮制方式，走进原产地的风情中。</p></div><div style="clear:both;"></div></div><hr><div class="content-wrapper" onClick="like(this)"><div class="img"><img src="./img/c2.jpg"></div><div class="para"><h2 id="kabu">卡布奇诺</h2><p>一种加入以同量的意大利特浓咖啡和蒸汽泡沫牛奶相混合的意大利咖啡。此时咖啡的颜色，就像卡布奇诺教会的修士在深褐色的外衣上覆上一条头巾一样，咖啡因此得名。</p></div><div style="clear:both;"></div></div><hr><div class="content-wrapper" onClick="like(this)"><div class="img"><img src="./img/c5.jpg"></div><div class="para"><h2 id="moka">摩卡咖啡</h2><p>摩卡是一种“巧克力色”的咖啡豆(来自也门的摩卡),这让人产生了在咖啡混入巧克力的联想,并且发展出巧克力浓缩咖啡饮料。</p></div><div style="clear:both;"></div></div><hr><script type="text/javascript">function loodAll(){var item = document.getElementsByClassName("content-wrapper");for(var i=0;i<item.length;i++){item[i].style.setProperty("background-image","none");}if(localStorage.length>0){for(var i=0;i<localStorage.length;i++){var id = localStorage.key(i);document.getElementById(id).parentNode.parentNode.style.setProperty("background-image","url('./img/c111.jpg')");}}}function like(obj){var id = obj.childNodes[3].childNodes[1].id;var name = obj.childNodes[3].childNodes[1].innerHTML;for(var i=0;i<localStorage.length;i++){if(localStorage.key(i)==id){localStorage.removeItem(id);console.log(localStorage);loodAll();return;}}localStorage.setItem(id,name);loodAll();console.log(localStorage);}</script></body>
</html>

check.html中的功能

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Document</title>
</head>
<body><h1>请选择您的爱好：</h1><input type="checkbox" οnchange="" checked="checked" />全选/全不选<br /><input type="checkbox" name="hobby" />足球<input type="checkbox" name="hobby" />篮球<input type="checkbox" name="hobby" />游泳<input type="checkbox" name="hobby" />唱歌 <br /><input type="button" value="全 选" οnclick="allCheck()"/><input type="button" value="全不选" οnclick="NoneCheck()"/><input type="button" value="反选" οnclick="fanzhuanCheck()"/><script type="text/javascript">function lg(a){console.log(a);}var checkbox = document.getElementsByName('hobby');function allCheck(){for(var i=0;i<checkbox.length;i++)checkbox[i].checked=true;}var checkbox = document.getElementsByName('hobby');function NoneCheck(){for(var i=0;i<checkbox.length;i++)checkbox[i].checked=false;}var checkbox = document.getElementsByName('hobby');function fanzhuanCheck(){for(var i=0;i<checkbox.length;i++)checkbox[i].checked=!checkbox[i].checked;}</script>
</body>
</html>

2017.11.15作业相关推荐

2017.11.3作业
浮动自学作业 <html><head><meta charset="UTF-8"><title>CODING COFFEE</ ...
【2017.11.15】设计师的正确工作流程
天才靠的是积累,聪明靠的是努力. 扩展扩展: banner 编辑: 可以作为网站页面的横幅广告,也可以作为游行活动时用的旗帜,还可以是报纸杂志上的大标题.Banner[1] 主要体现中心意旨,形象鲜明 ...
【2017.11.15】色彩的奥秘
做设计的人往往数学都不好,因为设计的思维从来不被公式束缚一,准确的实用颜色红色,大多数应用红色风格的有电商的天猫,京东,还有新闻类的网易,zaker,今日头条等. 因为红色在中国是一种权威,值得信 ...
2017无盘服务器,(2017.11.19)云更新2017正式版2017.6.15.6596无盘xp-win7x32-x64-win10x64公包...
重要更新: 一.重点功能更新 1.三层更新核心组件升级,降低80%的游戏更新量 : 2.新增显卡PNP功能 (新环境部署更简单): 3.同时支持中英双语言环境 (更高Bigger): 4.优化万兆环境 ...
Xamarin 2017.11.9更新
Xamarin 2017.11.9更新本次更新主要针对Xamarin.iOS,适配了iOS 11.1和Xcode 9.1.Visual Studio 2017升级到15.4.3获得新功能.Visu ...
Xamarin 2017.11.1更新
Xamarin 2017.11.1更新本次更新主要解决了一些bug.Visual Studio 2017升级到15.4.2获得新功能.Visual Studio 2015需要工具-选项-Xamar ...
Visual Studio 2017 version 15.9 官方最新版本下载(含那个啥码)
Visual Studio 2017 version 15.9 官方最新版本下载 (含那个啥码) 简单介绍,VS2017有3个版本: ①community,社区版,含基本的开发功能,免费!免费!免费! ...
2017第15届中国（武汉）国际汽车服务产业博览会会刊（参展商名录）
2017第15届中国(武汉)国际汽车服务产业博览会会刊(参展商名录) 展会名称: 2017年第15届中国(武汉)国际汽车服务产业博览会所属展馆: 武汉国际博览中心开展时间: 2017-06-16 ...
2017.2.15 开涛shiro教程-第二十一章-授予身份与切换身份（二） controller
原博客地址:http://jinnianshilongnian.iteye.com/blog/2018398 根据下载的pdf学习. 开涛shiro教程-第二十一章-授予身份与切换身份(二) 1.回顾 ...

2017.11.15作业

Coding Coffee产品页的like功能

2017.11.15作业相关推荐

最新文章

热门文章