在僞css選擇器上用knockoutJS綁定內容css屬性的文本

Question

我經常看到使用:: after css僞選擇器實現的時尚css效果。例如：

.bs-docs-example::after { content: "Example"; position: absolute; ...

在該Twitter的引導類content屬性定義元件後的文字在::。有什麼辦法可以通過將它與KnockoutJS綁定來實現這種動態？

Answer 1

我有幾次前，我確實是綁定到一個style元素，如文本的方式做一些與此類似：

<style type='text/css' data-bind="text: exampleAfterStyle"></style> 

與計算觀察到的，如：

var viewModel = { 
    name: ko.observable("Bob"), 
}; 

viewModel.exampleAfterStyle = ko.computed(function() { 
    return '.example::after { content: "' + viewModel.name() + '"; }'; 
}); 

這裏有一個例子：http://jsfiddle.net/rniemeyer/hfKPc/