JQuery - 獲取某些div的內容

我克隆了一個表單，它給了我很多我不想要的數據。我已經在做以下幫助JQuery - 獲取某些div的內容

var formDataUnformatted = $("#content").html(); 
var cleanFormData = formDataUnformatted.replace(/\t/, "").replace(/ ui-draggable| element/gi, "").replace(/<div class="close">.<\/div>/g, "").replace(/ data-(.+)="(.+)"/g, "");

然而，這仍然留給我很多東西。現在我可以看到自己做了許多替換電話來清理所有事情，這看起來並不好。上面給我留下了類似下面的內容（但是我刪除了很多不必要的代碼）。

<input style="" class="ui-sortable-handle" name="_token" value="sdfsd" type="hidden"> 
<div class="tab-pane active ui-sortable-handle" id="editor-tab"> 
     <fieldset id="content_form_name"> 
      <legend>Document Name</legend> 
     </fieldset> 
</div> 

<div class="form-group-handle"> 
    <label for="text_input" class="control-label col-sm-4">Text Input</label> 
    <div class="controls col-sm-7"> 
     <input id="text_input" class="form-control" name="text_input" type="text"> 
    </div> 
</div> 

<div class="form-group-handle"> 
    <label for="textareaInput" class="col-sm-4 control-label">Text Area:</label> 
    <div class="controls col-sm-7"> 
     <textarea rows="5" class="form-control" id="textareaInput" name="textareaInput" cols="50"></textarea> 
    </div> 
</div>

我的目標是獲取任何具有類窗體組處理的div的div和內容。所以基本上，上面應該變成

<div class="form-group-handle"> 
    <label for="text_input" class="control-label col-sm-4">Text Input</label> 
    <div class="controls col-sm-7"> 
     <input id="text_input" class="form-control" name="text_input" type="text"> 
    </div> 
</div> 

<div class="form-group-handle"> 
    <label for="textareaInput" class="col-sm-4 control-label">Text Area:</label> 
    <div class="controls col-sm-7"> 
     <textarea rows="5" class="form-control" id="textareaInput" name="textareaInput" cols="50"></textarea> 
    </div> 
</div>

而是找到所有的壞的div，並使用類似取代的，有沒有什麼辦法，只是找到我想要的類的所有div，而保留那些內容？

感謝

來源

2016-01-21 kate_hudson

使用克隆到特定的類：

var clone = $('.form-group-handle').clone();

來源

2016-01-21 13:12:23

$(".form-group-handle").each(function() 
 
{ 
 
    console.log($('.form-group-handle').clone()); 
 

 
    // or 
 

 
    console.log($('<div>').append($('.form-group-handle').clone()).html()); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input style="" class="ui-sortable-handle" name="_token" value="sdfsd" type="hidden"> 
 
<div class="tab-pane active ui-sortable-handle" id="editor-tab"> 
 
     <fieldset id="content_form_name"> 
 
      <legend>Document Name</legend> 
 
     </fieldset> 
 
</div> 
 

 
<div class="form-group-handle"> 
 
    <label for="text_input" class="control-label col-sm-4">Text Input</label> 
 
    <div class="controls col-sm-7"> 
 
     <input id="text_input" class="form-control" name="text_input" type="text"> 
 
    </div> 
 
</div> 
 

 
<div class="form-group-handle"> 
 
    <label for="textareaInput" class="col-sm-4 control-label">Text Area:</label> 
 
    <div class="controls col-sm-7"> 
 
     <textarea rows="5" class="form-control" id="textareaInput" name="textareaInput" cols="50"></textarea> 
 
    </div> 
 
</div>

來源

2016-01-21 13:23:27

問題是，html內容不在DOM中。 html存儲在變量formDataUnformatted中。那麼如何克隆變量formDataUnformatted中的所有.form-group-handle div？ –

是否可以執行以下操作：（1）** $（'。element'）。append（formDataUnformatted）; ** （2）** $（'。form-group-handle'）。clone （））; ** （3）** $（'。element'）。html（「」）; ** 這將從html字符串創建元素，然後找到它們，一旦找到刪除。 –

如果你使用jQuery與類選擇，jQuery對象只包含你需要

的div

$('div.form-group-handle')

但是，jQuery對象包含DOM元素的集合（chan用$。（'div.form-group-handle'）。length檢查與您的選擇器匹配的元素數量，因此您需要遍歷他們建立你的最終字符串。

如果你想每個HTML DIV

var formDataUnformatted = ''; 
$('div.form-group-handle').each(function() { 
    formDataUnformatted += this.outerHTML; 
    // where 'this' represents each matching div 
});

EDIT（關於你的約旦羅威的回答表明HTML是不是在DOM評論）

如果formDataUnformatted是代表HTML的字符串，你可以過濾內容獲得的div

$(formDataUnformatted).filter('div.form-group-handle');

來源

2016-01-21 13:32:17

少數這些答案的混合物的集合，我似乎找到了問題。上面的一些錯誤是因爲它不是JQuery對象。所以我想出了以下解決方案

var formDataUnformatted = $("#content").html(); 
var cleanFormData = formDataUnformatted.replace(/\t/, "").replace(/ ui-draggable| element/gi, "").replace(/<div class="close">.<\/div>/g, "").replace(/ data-(.+)="(.+)"/g, ""); 

var dataArray = new Array(); 

$(cleanFormData).filter('div.form-group-handle').each(function() { 
    dataArray.push(this.outerHTML); 
});

來源

2016-01-21 14:43:07

JQuery - 獲取某些div的內容

回答

相關問題