javascript - html 存储在 javascript 变量中，如何更新 javascript 变量中的 html

Question

这里，

var data = '
<table align="left" border="1" cellpadding="1" cellspacing="1" style="width: 100%;">    
    <tbody>     
        <tr>
            <td>
                <textarea cols="80" id="editor" name="editor" rows="10">This is my textarea to be replaced with Editor.</textarea>
            </td>
        </tr>
        <tr>
            <td colspan="2">&copy; 2016 Vishmay Shah</td>
        </tr>
    </tbody>
</table>
<p>&nbsp;</p>'

我想在数据变量中使用 jquery 将编辑器的 id 更新为 editor1

我可以使用

访问它

   $('#editor', Data)[0].id=$('#editor', Data)[0].id+'1';

但我想将更新后的 HTML 保存到数据变量中。

更新

将会有多个具有相同 id 编辑器的编辑器。

实际上，我想通过附加索引来使其唯一。

即editor0,editor1,...，替换功能会替换所有编辑器，所以没有帮助

  var editors = $('#editor', Data);
    for (var i = 0; i < editors.length; i++) {
        var subeditor = editors[i].id + i;
        editors[i].id = subeditor;
     }

Answer 1

如果你有多个具有相同ID名称的，也许你需要通过属性找到它并用索引替换旧的ID名称，如下所示:

var Data = '<table align="left" border="1" cellpadding="1" cellspacing="1" style="width: 100%;">    <tbody>     <tr><td><textarea cols="80" id="editor" name="editor" rows="10">This is my textarea to be replaced with Editor.</textarea><textarea cols="80" id="editor" name="editor" rows="10">This is my textarea to be replaced with Editor.</textarea></td>     </tr>       <tr>            <td colspan="2">&copy; 2016 Vishmay Shah</td>       </tr>   </tbody></table><p>&nbsp;</p>';
// this will look the element with ID editor
// and replace element with index
var newElem = $(Data).find('[id="editor"]').attr('id', function(i, old) {
     return old + i;
}).end();
console.log(newElem)

DEMO (检查元素以查看实际 ID)