• 有红, 黄, 蓝三个按钮, 以及一个200X200px的矩形box, 点击不同的按钮, box的颜色会被切换为指定的颜色
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title> </head>
<style>
.box {
width: 200px;
height: 200px;
background-color: red;
}
</style> <body>
<div id="d1">
<p>
<button @click="ck('red')">红</button>
<button @click="ck('yellow')">黄</button>
<button @click="ck('blue')">蓝</button>
</p> <div class="box" :style="{backgroundColor: color}"></div>
</div>
</body>
<script src="js/vue.js"></script>
</html>
<script>
new Vue({
el: '#d1',
data: {
color: 'red'
},
methods: {
ck(color) {
this.color = color;
}
}
})
</script>
  • 一个200X200px的矩形box, 点击box本身, 记录点击次数, 1次box变为粉色, 2次变为绿, 3次变为蓝色, 4次重新回到粉色, 依次类推
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title> </head>
<style>
.wrap {
width:200px;
height:200px;
background-color:red;
}
</style>
<body>
<div id="d1"> <div class="wrap" :style="{backgroundColor:color}" @click="changeColor"></div> </div><script src="js/vue.js"></script> <script>
new Vue ({
e1: '#d1',
data: {
color: 'black',
count:0,
colorTrans: ['pink','cyan','green']
},
method: {
changeColor(){
let i = this.count+1;
this.color = this.colorTrans;
}
}
})
</script> </body>
</html>

day 67 作业的更多相关文章

  1. 2016福州大学软件工程Beta阶段团队作业成绩汇总

    1.评分规则 本次Beta阶段团队作业评分方法如下: 团队得分=[[7次scrum过程评分+(小组互评得分+教师评分)/2]/2],其中过程.小组.教师各30分 说明:由于没有规定提交团队贡献比,因此 ...

  2. 耿丹CS16-2班课堂测试作业汇总

    Deadline: 2016-11-01 11:59 作业内容 课堂测试作业总结 00.题目得5分,多半扣在格式上,有些同学代码写得很过分,已经很仁慈对待,同学们珍惜之: 01.界面设计得分不好,换行 ...

  3. SQL SERVER 中如何用脚本管理作业

    在SQL SERVER中用脚本管理作业,在绝大部分场景下,脚本都比UI界面管理作业要高效.简洁.打个简单的比方,如果你要查看作业的运行时长,如果用UI界面查看,100个作业,你就得在历史记录里面至少查 ...

  4. 第二次团队作业 -- 预则立&&他山之石

    我说的都队 031402304 陈燊 031402342 许玲玲 031402337 胡心颖 031402203 陈齐民 031402209 黄伟炜 031402233 郑扬涛 一.团队任务计划 周数 ...

  5. 软件工程(QLGY2015)第三次作业点评(含成绩)

    相关博文目录: 第一次作业点评 第二次作业点评 第三次作业点评 团队信息 本页点评团队1-22,其他组见:http://www.cnblogs.com/xiaozhi_5638/p/4490764.h ...

  6. 作业成绩 final-review 20161201-1203 15:05

    final-review阶段,20161201-20161203 15:05 final 评论II截止 20161204 09:00 申诉截止时间 20161207 12:00,微信联系杨贵福. 凡描 ...

  7. 作业成绩 final 20161124-1201 09:00

    final阶段,20161124-1201 09:00. 申诉截止时间 20161206 12:00,微信联系杨贵福. 凡描述需求或BUG时,应给出以下4项: 你期待看到的现象如何 你实际看到的现象 ...

  8. 第三次作业——K米评测

    第一部分 调研,评测 1.第一次上手体验 其实让我下载一个APP并且长期使用它是一件特别难的事情,不仅是因为占空间,需要注册个人信息,绑定账号,更是因为每款软件的功能虽然都很齐全,但是你并在没有真正用 ...

  9. C2第三次作业解题报告

    看过题解后如果觉得还算有用,请帮忙加点我所在团队博客访问量 http://www.cnblogs.com/newbe/ http://www.cnblogs.com/newbe/p/4069834.h ...

随机推荐

  1. 【转】Spring全家桶

    Spring框架自诞生以来一直备受开发者青睐,有人亲切的称之为:Spring 全家桶.它包括SpringMVC.SpringBoot.Spring Cloud.Spring Cloud Dataflo ...

  2. http协议里定义的四种常见数据的post方法

    原文 https://blog.csdn.net/charlene0824/article/details/51199292 关于http协议里定义的四种常见数据的post方法,分别是: applic ...

  3. 每天一道Rust-LeetCode(2019-06-08)

    每天一道Rust-LeetCode(2019-06-08) 91. 解码方法 坚持每天一道题,刷题学习Rust. 题目描述 https://leetcode-cn.com/problems/decod ...

  4. 重装系统的jdk问题???

    重装系统了!!!! 之前因为不懂电脑,然后自己动手装了台台式机,简直太开心了,又自己装了个系统,一切都非常欢乐,来到了给电脑起名字的时候,我不知道有多少人会卡在起名字这里,但是我那个时候非常开心,就想 ...

  5. [LeetCode] 322. Coin Change 硬币找零

    You are given coins of different denominations and a total amount of money amount. Write a function ...

  6. 《30天自制操作系统》笔记3 --- (Day2 上节)完全解析文件系统

    Day2 汇编语言学习与Makefile入门 本文仅带着思路,研究源码里关于文件系统的参数 关于day2主程序部分及更多内容,请看<30天自制操作系统>笔记 导航 发现学习中的变化 源码差 ...

  7. oracle- 审计日志

    一.审计功能关闭 1.查看审计功能是否开启? su – oracle sqlplus “/as sysdba” SQL> show parameter audit_trail NAME      ...

  8. OAuth2、OpenID、SMAL 对比

    对比点 OAuth2.0 OpenID SMAL2 票据格式 JSON or SAML2 JSON XML 支持授权 Yes Yes Yes 支持认证 “伪认证” Yes Yes 创建年份 2005 ...

  9. pytorch 查看中间变量的梯度

    pytorch 为了节省显存,在反向传播的过程中只针对计算图中的叶子结点(leaf variable)保留了梯度值(gradient).但对于开发者来说,有时我们希望探测某些中间变量(intermed ...

  10. python字符串各种颜色输出

    \033[1;31;40m      # 1是显示方式(可选),31是字体颜色,40m 是字体背景颜色: \033[0m           # 恢复终端默认颜色,即取消颜色设置: #!/usr/bi ...