我如何在DIV中的DIV内部与DIV中的多个Divs的串联数据

Question

我有一个应用程序，其中我有一个div并添加列按钮，当我单击添加列按钮时，列会在div中添加。现在我想做的是该div列中有一些元素，例如 <ol>和 <li>，我想为每个div分别将它们连接到字符串中，我该怎么做？

这就是我的div外观中的列：

<div id="columnholder">
    <div class="shoppingCart" id="shoppingCart1">
    <h2 class="ui-widget-header">Add Menu Items Here <img onclick="removecolumn(this.id)" style="float: right; cursor:pointer;" id="shoppingCart1" src="../Images/delete.png"></h2>
    <aside id="droppable" class="ui-widget-content">
    <ol class="ui-droppable">
      <li>Brand1
          <ol class="ui-droppable">
              <li>Add Sub Menu here</li>
               <li>Category2
                  <ol class="ui-droppable">
                     <li>Add Sub Menu here</li>
                     <li>Product2
                        <ol class="ui-droppable">
                             <li>Add Sub Menu here</li>
                                <li>Product4
                                  <ol class="ui-droppable">
                                       <li>Add Sub Menu here</li>
                                             <li>Product3
                                                <ol class="ui-droppable">
                                                   <li>Add Sub Menu here</li>
                                                       <li>Product3
                                                         <ol class="ui-droppable">
                                                            <li>Add Sub Menu here
                                                              </li>
                                                          </ol>
                                                     </li>
                                                </ol>
                                          </li>
                                    </ol>
                              </li>
                        </ol>
                   </li>
              <li>Product2
                 <ol class="ui-droppable">
                         <li>Add Sub Menu here</li>
                              <li>Product4<ol class="ui-droppable">
                                    <li>Add Sub Menu here</li>
                                         <li>Product4
                                             <ol class="ui-droppable">
                                                   <li>Add Sub Menu here</li>
                                                          <li>Product4
                                                             <ol class="ui-droppable">
                                                               <li>Add Sub Menu here 
                                                                  </li>
                                                               <li>Product4
                                                                  <ol class="ui-droppable">
                                                                        <li>Add Sub Menu here</li>
    </ol></li></ol></li></ol></li></ol></li></ol></li></ol></li></ol></li></ol></aside></div>

    <div class="shoppingCart" id="shoppingCart2">
    //data like above         
    <div>
    // there may be number of columns
    </div>

我想要的是将它们串联成单独串起，例如" shoppcart1"div中的数据，对于列持有人Div中的其他divs的串联且相同，请在这里对我有帮助。我该怎么做？

Answer 1

$('.ui-droppable li').map(function() {
  return $(this).text().trim().replace(/s+/, ' ');
}).get().join(" ");

这应该使您运行。现在，您只需要更新此片段即可提供您想要的任何内容。