JavaScriptとHTMLのより良い分離のためのカスタム属性の追加

Question

jQueryとbackbone.jsを使用して、JavaScriptとHTMLを可能な限り分離したいと思います。
custom attributeを追加すると、JavaScriptとHTMLの分離を改善できますか？ そして、新しいjQueryセレクターを使用するにはどうすればいいですか？

例：あなたが使用することができます

<input type="text" id="todo-input" class="todo-input" tid="tid-attribute" > hello world </input> 

// The DOM events 
// I would like to use another selector tid and not class or id 
events: { 
    "keypress #todo-input" : "updateOnEnter" // I would like to use another selector tid not id, 
    "keypress .todo-input" : "updateOnEnter" // I would like to use another selector tid and not class 
} 

Answer 1

HTML5はdata-で始まるカスタムデータ属性が可能になります：

<input type="text" data-custom-attr="somevalue"> 

は、その後、あなたの基幹イベント宣言で：

"keypress [data-custom-attr='somevalue']" : "updateOnEnter" 

Answer 2

：

$('input[type="text"]').attr('tid', 'tid-attribute'); 

OR

$('input[type="text"]').attr('data-tid', 'tid-attribute');