jquery合并元素

我正在重构我的jQuery UI部件之一。
为了得到一个更干净的代码，我使用模板来完成基本的html东西。
小部件的基本容器是一个div。该小窗口的用户可能会在设计这样的：现在jquery合并元素

<div id="mywidget" class="status" style="margin-top: 10px; width: 250px;"></div>

，在widget源我有一个字符串基本HTML元素：

'<div class="ui-grouping ui-widget ui-widget-content ui-corner-all">' + 
'<span class="ui-grouping-detail"><img src="....

当用户使用$创建插件（'＃进myWidget'）ABCD（）;我不想追加HTML串到基DIV，但我想串合并到基地DIV，使最终的结果是这样的：

<div id="mywidget" class="status ui-grouping ui-widget ui-widget-contet ui-corner-all" 
    style="margin-top: 10px; width: 250px;"> 
<span class="ui-grouping-detail"><img src=" ...

我没有找到一个函数$（ '#mywidget'）。mergeWith（ “......”）。
这将是一个很好的解决方案吗？
非常感谢
沃尔夫冈

更新：谢谢你，迪迪埃Ghys，你的答案。
但我想摆脱你提出的解决方案。你的解决方案是在jQuery UI部件中完成的标准方式。您必须长时间搜索才能在jquery窗口小部件中找到模板的用法（为了获得标记和javascript的分离，并因此获得更清晰/更清晰的代码）。据我所知，在dojo小部件中，在小部件中使用模板更为常见。因此，再次感谢Didier Ghys，但我寻找另一种解决方案。

来源

2012-02-15 Wolfgang Adamec

http://jsfiddle.net/DaKeg/

var str = '<div class="ui-grouping ui-widget ui-widget-content ui-corner-all">' + 
'<span class="ui-grouping-detail">dskfjsdmf</span></div>'; 

$("#mywidget").addClass(getFirstClass(str)); 
$("#mywidget").append(getElementInside(str)); 

function getFirstClass(_str){ 
    return $(_str).closest('div').attr('class'); 
} 
function getElementInside(_str){ 
    return $(_str).closest('div').children(); 
}

来源

2012-02-15 12:22:55 mgraph

谢谢mgraph，你的回答，有趣的方法。我会接受。 – 2012-02-15 12:48:00

我想你不应该保存基本元素作为一个字符串，然后添加类和编程等通过插件的用户提供的标记：

$('<div id="mywidget" class="status" style="margin-top: 10px; width: 250px;"></div>') 
    .addClass('ui-grouping ui-widget ui-widget-content ui-corner-all') 
    .append('<span class="ui-grouping-detail">')

是你以后在做什么？

来源

2012-02-15 12:01:42

jquery合并元素

回答

相关问题