附加到不在DOM树中的元素

时间:2015-03-25 21:05:58

标签: javascript jquery html

所以我正在构建一个div:

 var editArea =  '<div class="edit-container" style="padding-bottom: 10px;">' +
                '       <textarea class="form-control" style="margin-bottom:5px;">'+
                '       </textarea>' +
                '       <button type="button" class="btn right "><i class="fa fa-times-circle "></i>Leave Editor</button>'+
                '       <button type="button" class="btn submit-edit pull-right right " style="color:#fff;padding-top:5px; background-color: #3D8A11; border: 1px solid #f2f2f2;"><i class="fa fa-check-circle"></i>Submit</button>'+
                '</div>';

并希望在将其插入DOM之前向其添加内容:

for(i = 0; i < data.length; i++){
var fileLink = '<a href="#">' +data[i].username+'</a>';
editArea.('.edit-container').prepend(fileLink);
}

考虑到构建div的一些非常规语法,我将如何做到这一点?如果你这么做的话,我可能会以不同的方式构建初始div。我只是喜欢这种风格的单线方式。

工作原理:

var editArea =  $('<div class="edit-container" style="padding-bottom: 10px;">' +
                    '       <textarea class="form-control" style="margin-bottom:5px;">'+
                    '       </textarea>' +
                    '       <button type="button" class="btn right "><i class="fa fa-times-circle "></i>Leave Editor</button>'+
                    '       <button type="button" class="btn submit-edit pull-right right " style="color:#fff;padding-top:5px; background-color: #3D8A11; border: 1px solid #f2f2f2;"><i class="fa fa-check-circle"></i>Submit</button>'+
                    '</div>');

真诚地感谢您的帮助。非常感谢。

1 个答案:

答案 0 :(得分:1)

jQuery可以对与DOM分离的项进行操作,因此只需将文本转换为jQuery对象并对其进行操作即可。

var $editArea = $(editArea); //converts text to a jQuery object
$editArea.prepend(fileLink);

如果您只需要获取HTML字符串:

$editArea.html()