js中的剔除數據綁定語法（不是HTML）

Question

我了解我可以在dom中使用以下語法創建綁定：

 <span id="namespan" data-bind="text: personName"> 

這里的工作示例： https : //jsfiddle.net/m14mohda/

但是我可以在js中創建這樣的span元素嗎？ 即使用類似的東西：

createSpans = function (){
    var s = document.createElement('span')
    s.id = "namespan"
    s.data-bind ="text: personName" -----> ????
    document.body.appendChild(s)
}

Answer 1

DOM元素API提供了兩種方法。 適用於任何自定義屬性的更通用的方法是使用setAttribute方法。

var s = document.createElement('span');
s.setAttribute("someAttribute", "someValue");
s.setAttribute("data-bind", "text: personName");
document.body.appendChild(s);

創建元素

<span someAttribute="someValue" data-bind="text: personName"></span>

特別是對於以數據為前綴的屬性，規范包括速記屬性訪問器dataset 。

var s = document.createElement('span');
s.dataset.someAttribute = "someValue"; // won't work as expected       
s.dataset.bind = "text: personName";
document.body.appendChild(s);

創建元素

<span data-someAttribute="someValue" data-bind="text: personName"></span>

因此，您可以看到dataset將數據前綴視為理所當然。 然后，通過剝離數據部分，可以通過dataset訪問和分配數據屬性值。