Vue.js 控制css样式
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<style type="text/css">
.blue{ background-color: blue;
}
.green{ background-color: green;
}
div{
width: 400px;
height: 200px;
border-bottom-width: 2px;
}
</style> <div id="container"> <div v-for="item in someData" class="blue" v-bind:class="{'green': item.selected }" @click="green(item)">
点我
</div>
</div> <script> var vm = new Vue({
el: '#container',
data: {
someData: [{"id":1,selected:true},{"id":2,selected:false},{"id":3,selected:true}] },
methods:{
green:function(item){
item.selected=!item.selected;
}
} }) </script>
Vue.js 控制css样式的更多相关文章
- JS 控制CSS样式表
JS控制CSS所使用的方法: <style> .rule{ display: none; } </style> 你想要改变把他的display属性由none改为inline. ...
- 用JS控制CSS基本样式
详见:http://blog.yemou.net/article/query/info/tytfjhfascvhzxcytp29 用JS控制CSS基本样式的方法 CSS code .class1 { ...
- jQuery控制CSS样式
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
- js控制div样式显示与隐藏,JS通过点击超链接右边(指定位置)显示一个图标
原文出自:https://blog.csdn.net/seesun2012 javascript基础篇,老土的方法解决js控制div样式,便于新手理解,粗暴的不能再粗暴,如果你是高手,请忽略! 思路: ...
- js设置css样式.
在js设置css样式做法 var obj = document.getElementById('div'); obj.style.width = '100px'; obj.style.height = ...
- php有效的过滤html标签,js代码,css样式标签
过滤html标签�php中太简单了,我们可以直接使用strip_tags函数来实现了,下面给各位整理了一些关于 strip_tags函数的例子. php过滤html的函数:strip_tags(str ...
- 原生js更改css样式的两种方式
下面我给大家介绍的是原生js更改CSS样式的两种方式: 1通过在javascript代码中的node.style.cssText="css表达式1:css表达式2:css表达式3 &quo ...
- 用js控制css属性
在用js控制css属性时,行内css属性可以任意控制,但若是在<style></style>中写的css属性,均不能用alert读取,但是赋值却有几种现象, 第一种:无法读取, ...
- 11-13 js操作css样式
1.Js操作css样式 Div.style.width=”100px”.在div标签内我们添加了一个style属性,并设定了width值.这种写法会给标签带来大量的style属性,跟实际项目是不符. ...
随机推荐
- 关于php注释那些事
代码注释的作用 --- 为自己,也为别人. 永远不要过于相信自己的理解力!当你思路通畅,思如泉涌,进入编程境界,你可以很流畅的实现某个功能,但这种一泻千里的流畅可能只停留在了当时的状态.当你几个月, ...
- Spring Boot 2.x监控数据可视化(Actuator + Prometheus + Grafana手把手)
TIPS 本文基于Spring Boot 2.1.4,理论支持Spring Boot 2.x所有版本 众所周知,Spring Boot有个子项目Spring Boot Actuator,它为应用提供了 ...
- 如何修改git上传代码的作者姓名
随着IT行业的不断壮大,开源的东西越来越多,使用git来进行代码管理的人自然也越来越多,而且很多人的git账户都不是自己的本人名字,但是在公司工作的时候为了遇到问题能够定位责任人和便于区分提交人,通常 ...
- Project Euler 52: Permuted multiples
可以看到数字125874的两倍251748和它有着完全相同的数字,只是顺序不同而已.求一个最小的正整数\(x\),使得\(2x,3x,4x,5x,6x\)都有完全相同的数字. 分析:此题的思路比较直接 ...
- UiPath之基础知识(一)
各位小伙伴,大家好.在10月份小U的微信订阅号做了一个投票,主题是UiPath目前已经掌握的程度. 从投票的结果来看,有一半以上的人还是刚刚起步,为了帮助刚刚起步的小伙伴,准备陆续发布一些基础性的内容 ...
- 『题解』洛谷P3958 奶酪
Portal Portal1: Luogu Portal2: LibreOJ Portal3: Vijos Description 现有一块大奶酪,它的高度为\(h\),它的长度和宽度我们可以认为是无 ...
- php session获取不到的解决方法
php session获取不到的解决方法 因为sesson数据是存在服务器端的硬盘一般临时空间不足 /tmp/ 1 这个需要清空下系统盘就可以了2 你可以在空间充足的地方mkdir 文件夹——你可以使 ...
- 装上linux后的准备工作
A.修改对应网卡的IP地址的配置文件 1 2 3 4 5 6 7 8 # vi /etc/sysconfig/network-scripts/ifcfg-eth0 IPV6INIT=no #关闭 ...
- 后台开发小白必学服务器框架——UDPServer
毕业后加入了一家大型的互联网公司的音视频产品部门做后台开发,其实我本身是学习自动化的,研究生的方向嵌入式系统,对互联网可是一知半解,因此能进入这样一个大公司还是很幸运的. 刚开始工作的半年应该是在上份 ...
- Swoole和Redis实现的并发队列处理系统
由于PHP不支持多线程,但是作为一个完善的系统,有很多操作都是需要异步完成的.为了完成这些异步操作,我们做了一个基于Redis队列任务系统. 大家知道,一个消息队列处理系统主要分为两大部分:消费者和生 ...