HTML根据条件判断使用哪个class-name

最新推荐文章于 2022-09-06 16:33:49 发布
最新推荐文章于 2022-09-06 16:33:49 发布
阅读量1.1k 收藏
点赞数
分类专栏： 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/chao_ji_cai/article/details/117652693
版权

在v-for循环语句中，想根据后端传来的list的某个值来指定不同的class

:class="{'fd-step-blue':item.zt == 1,
'fd-step-green':item.zt==2,
'fd-step-red':item.zt==3,
'fd-step-grey':item.zt==0,
'fd-step':index != dzsjdclcList.length-1,
'fd-step-last':index == dzsjdclcList.length-1}"
偷偷写博客567
关注
专栏目录
css class 多种规则判断样式
Little___Turtle的博客
07-22 502
商品分类选择变量 上下的分类需要添加圆角 这个就设计到多个分类的判断。
前端面试 class加数据类型判断加原型和原型链
weixin_45391167的博客
03-16 341
Class & 继承 & 原型 & 原型链 Class ES6提供了更接近传统语言的写法，引入了Class（类）这个概念，作为对象的模板。通过class关键字，可以定义类。基本上，ES6的class可以看作只是一个语法糖，它的绝大部分功能，ES5都可以做到，新的class写法只是让对象原型的写法更加清晰、更像面向对象编程的语法而已。 类的声明 比如 声明一个类，并声明一个该类的实例 class Student { //constructor 构造函数 construc
根据条件判断使用不同的class
乐天小葵
01-05 2790
如何得到某个类所对应的class对象
l_rui_ci的专栏
05-18 367
1、在的类的.class语法2、通过类的getClass()3、通过Class类的静态方法forName()
根据类名获得对应的Class
stephen830
11-21 326
  根据类名获得对应的Class   NSString *clsName = @"UIButton"; Class aClass = NSClassFromString(clsName);  
Java中如何获得一个对象所对应的类及Class类的简单理解
08-09 736
Java中如何获得一个对象所对应的类及Class类的简单理解 前言 在之前的学习中，所用的编程语言主要是Python，最近开...
前端框架系列之（vue-class-component）
vv_bug
06-14 5423
简介： 说到函数式组件跟类组件在react官方就有提供，具体差异的话大家可以自行查阅react开发文档，下面我们看一下在react中怎么使用这两种方式定义组件： 函数式组件： function Welcome (props) { return <h1>Welcome {props.name}</h1> } 类组件： class Welcome extends React.Component { render() { return ( <h1>
前端加载table时，根据条件判断a标签是否显示(使用动态id)
intelrain的博客
09-25 5207
for (let i = 0; i &lt; datanew.length; i++) { let trItem = $('&lt;tr&gt;&lt;/tr&gt;'); trItem.append('&lt;td hidden&gt;' + datanew[i].cid + '&lt;/td&gt;'); ...
Vue条件循环判断+计算属性+绑定样式v-bind
热门推荐
zxy9602的博客
09-28 1万+
Vue.js条件与循环 1、条件判断 （1）v-if， 现在你看到我了 菜鸟教程 new Vue({ el:'#app', data:{ seen:true, ok:true } }); （2）v-else-if （3）v-else A
面试 - 反射中Class.forName()和ClassLoader.loadClass()的区别 ，判断一个类是否已经被加载
tianyeshiye
02-19 2516
ClassLoader关键在于 加载  -&gt;  链接（验证+准备+解析） -&gt;  初始化（使用前的准备） -&gt;  使用  -&gt;  卸载  可以只加载，不链接 ClassLoader.loadClass(className) ClassLoader.loadClass(className,false) 也可以加载，并链接 Class.forName(classNa...
Thymeleaf中使用if和unless实现状态的判断显示达到if-else逻辑判断的效果
BADAO_LIUMANG_QIZHI的博客
05-15 7402
场景 Thymeleaf官方文档： https://www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf.html#introducing-thymeleaf 官方文档说明： 有时，只有在满足特定条件时，才需要显示模板的片段。 官方使用示例： <table> <tr> <th>NAME&l...
循环数据根据数据不同显示不同的class样式.html
weixin_30588827的博客
02-13 853
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>指令</title> <script src="js/vue.js" type="text/javascript" charset="utf-8"&gt...
给html里面的class添加一个判断语句，判断当前class是否显示（vue）
weixin_30955617的博客
12-18 1659
当我们想判断这个class是否出现时，其实有很多方法， 我这个是做了一个选项卡，当点击的时候navTitle的值和循环的item的值相同时class就等于borderbottom, 这样我们点击的图层的颜色就可以给class添加相信的background-color 转载于:https://www.cnblogs.com/putao1/p/10138372.html...
html根据数字显示不同,循环数据根据数据不同显示不同的class样式.html
weixin_31937319的博客
06-15 650
指令 .color1{ color: red; } .gray{ background: gray; } .blue{ background: blue...
如何根据前端传来的字段中的值来决定后端中用相对于的那个方法
等待のL先森的博客
07-05 839
如何根据前端传来的字段中的值来决定后端中用相对于的那个方法 1. 前言： 最近在公司看源码，对于，如何根据前端传来的字段中的值来决定后端中用相对于的那个方法这个方法，有了更好的理解； 2. before: 如果是以前，可能会跟着最基本的思路，根据前端传来的值进行判断，在做一个方法的调用；但是，但是，但是，这种方法实在是太low了，代码也不够优雅。 3. later: 在了解了公司的优雅代码后，我进化了。。。 根据java类的多继承原理，我们呢， 可以写个接口来规范下定义方法，然后根据定义让不同场
html 根据条件执行css
juncaixingchilove的专栏
09-06 291
html 根据条件执行css
html中class设置判断,jquery如何判断是否存在指定class（类）？
weixin_39600400的博客
06-20 1012
在jquery中，可以使用hasClass()方法来判断元素中是否存在指定class(类)。下面本篇文章就来给大家介绍一下jquery hasClass() 方法，希望对大家有所帮助。hasClass() 方法检查被选元素是否包含指定的 class。如果被选元素包含指定的类，该方法返回 "true"，否则返回false。语法$(selector).hasClass(class)参数：class：必...
AngularJS 之ng-class 按条件设置class的几种方式
Keep moving on.
09-22 8444
第一种：在dom中将class的值用变量替代，然后在controller函数中设置变量的值。如下所示：  &lt;!DOCTYPE html&gt; &lt;html ng-app="myApp"&gt; &lt;head lang="en"&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;&lt;
标题大小与字体大小的关系
Guo_Elleny的博客
09-27 1003
1到6号标题与1到6号字体逆序对应，比如1号字体对应6号标题，2号字体对应5号标题。 <h1>这是1号标题</h1> <font size="6">这是6号字体文本</font> <h2>这是2号标题</h2> <font size="5">这是5号字体文本</font> <h3>这是3号标题</h3> <font size="4">这是4号字体文本</font&gt
row-class-name 如何使用
最新发布
09-17
要使用row-class-name属性，你需要将它添加到el-table组件上，并在data中定义一个方法来判断每一行应该添加的类名。方法的参数是当前行的数据和索引。在方法中，你可以根据你的需求来编写判断逻辑，并返回对应的类名...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值