jQuery:在HTML字符串中展开元素

Question

http://jsfiddle.net/vol7ron/vZLnr/

我正在尝试找到解开HTML字符串(如AJAX响应)的最佳方法,而不首先将其附加到文档中.另外,哪种内存管理最好？

HTML

• <div class="label">Start With:</div>
  <pre id="original"></pre>
  
  <div class="label">What's Wanted:</div>
  <pre id="wanted"><div>foo</div><div>bar</div></pre>
  
  <hr />
  
  <div class="label">Attempt: .find()</div>
  <pre id="find"></pre>
  
  <div class="label">Attempt: .closest()</div>
  <pre id="closest"></pre>
  

CSS

• .label    { font       : italic bold 11px Georgia;   margin    : 1em 0 .5em; }
  pre       { border     : 1px solid black;            padding   : 1em;        }
  hr        { margin     : 1.5em 0 1em; }
  
  #original { background : #eee; }
  #wanted   { background : #def; }
  

JavaScript的

•    var $html= "<pre><div>foo</div></pre><pre><div>bar</div></pre>";
  
     // No Changes
     jQuery('#original').html($html);
  
  
     // Find
     var $find = jQuery($html).find('*').unwrap();
     jQuery('#find').html($find);
  
  
     // Closest
     var $closest = jQuery($html).closest('pre').unwrap().html();
     jQuery('#closest').html($closest);
  
  
     // Wrapped
     var $pre = jQuery('pre', jQuery($html).wrap('<div />').parent() );
     $pre.each(function(){
                  jQuery('#wrapped').append(jQuery(this).html());
              });
  
     //=========== Prettify Output ===========
     var $wanted = jQuery('#wanted').html();
     jQuery('pre').not('#wanted, #original, #original *')
                  .each(function(){
                    var t = jQuery(this);
                    t.css({background: t.html()==$wanted?'#efe':'#fee'});
                  });
  

---

编辑

1. 该.find()方法需要一些工作,因为它删除了空白容器.想象一下<pre><span>Code</span> <span>Here</span></pre>,它会变成<span>Code</span><span>Here</span>(掉落的空白).

Answer 1

一种通用的解包方法是简单地遍历字符串，无论是最外面的标签还是特定的标签，将不属于标签的每个字符添加到新字符串中（一旦点击 <，检查整个字符串）标签）。找到后，从 0 开始计数器并继续遍历字符串，直到找到其结束标记，将每个字符添加到新字符串中。如果此时计数器为 0，则跳过该标记并将原始字符串的其余部分添加到新字符串中。每当您遇到任何类型的开始标签时，请在计数器中添加一个。对于任何结束标签，减去 1（这样您最终就不会从嵌套标签中删除结束标签）。

我无法真正谈论内存管理，因为我不熟悉 javascript 如何管理内存。

我希望我能提供一些帮助。