javascript - 使用 jquery 包装

Question

我有一个带有数据的变量包装器:

<div class="elementwrapper" draggable="true" ondragstart="drag(event)" >    
<span class="edittool">
    <span class="glyphicon glyphicon-pencil editpencil" onclick="editContent(this);" style="padding:0 5px 0 0;"></span>
    <span class="glyphicon glyphicon-ok editok" onclick="doneEdit(this);" style="display:none;padding:0 5px 0 0;"></span>
    <span class="glyphicon glyphicon-remove editcancel" onclick="doneEdit(this);" style="display:none;padding:0 5px 0 0;"></span>
</span>     
</div>

我想使用 edittool 类将当前元素数据包装在 span 中。我用过:

$(currentElement).wrap(wrapper);

但是我得到的是:

 <div class="elementwrapper" draggable="true" ondragstart="drag(event)" >   
<span class="edittool">
    <span class="glyphicon glyphicon-pencil editpencil" onclick="editContent(this);" style="padding:0 5px 0 0;">
        MY DATA
    </span>
    <span class="glyphicon glyphicon-ok editok" onclick="doneEdit(this);" style="display:none;padding:0 5px 0 0;"></span>
    <span class="glyphicon glyphicon-remove editcancel" onclick="doneEdit(this);" style="display:none;padding:0 5px 0 0;"></span>
</span>     
</div>

它应该位于 edittool span 内部以及所有内部 span 中。我该怎么做？

Answer 1

您可以使用.append()将数据放入span内。见下面的代码

$(function(){
   var wrapper = "MY DATA";
   $('span.edittool').append(wrapper);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<div class="elementwrapper" draggable="true" ondragstart="drag(event)" >   
<span class="edittool">
    <span class="glyphicon glyphicon-pencil editpencil" onclick="editContent(this);" style="padding:0 5px 0 0;">
    </span>
    <span class="glyphicon glyphicon-ok editok" onclick="doneEdit(this);" style="display:none;padding:0 5px 0 0;"></span>
    <span class="glyphicon glyphicon-remove editcancel" onclick="doneEdit(this);" style="display:none;padding:0 5px 0 0;"></span>
</span>     
</div>