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的内容

回答

相关问题