html div类 名字,CSS类名绑定

目的

css绑定是添加或删除一个或多个CSS

class到DOM元素上。 非常有用,比如当数字变成负数时高亮显示。(注:如果你不想应用CSS

class而是想引用style属性的话,请参考style绑定。)

例子

Profit Information

var viewModel = {

currentProfit: ko.observable(150000)

// Positive value, so initially we don't apply the "profitWarning" class

};

viewModel.currentProfit(-50);

// Causes the "profitWarning" class to be applied

效果就是当currentProfit

小于0的时候,添加profitWarning CSS class到元素上,如果大于0则删除这个CSS class。

参数

主参数

该参数是一个JavaScript对象,属性是你的CSS class名称,值是比较用的true或false,用来决定是否应该使用这个CSS class。

你可以一次设置多个CSS class。例如,如果你的view model有一个叫isServre的属性,

非布尔值会被解析成布尔值。例如, 0和null被解析成false,21和非null对象被解析成true。

如果参数是监控属性observable的,那随着值的变化将会自动添加或者删除该元素上的CSS class。如果不是,那CSS

class将会只添加或者删除一次并且以后不在更新。

你可以使用任何JavaScript表达式或函数作为参数。KO将用它的执行结果来决定是否应用或删除CSS class。

其它参数

注:应用的CSS

class的名字不是合法的JavaScript变量命名

如果你想使用my-class

class,你不能写成这样:

...

因为my-class不是一个合法的命名。解决方案是:在my-class两边加引号作为一个字符串使用。这是一个合法的JavaScript 对象

文字(从JSON技术规格说明来说,你任何时候都应该这样使用,虽然不是必须的)。例如,

...

依赖性

除KO核心类库外,无依赖。

ko内置的基础绑定之一

用于控制DOM元素的class属性(因此个人认为叫做class

binding更直接一些)。

会根据所绑定的bool值(或者可以返回bool值的js表达式),给元素

移除/添加 对应的class名称

如果与observable或者computed属性绑定,则会产生双向绑定效果。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值