jquery clone div into variable和remove style属性

时间:2015-08-02 16:49:22

标签: jquery

我需要从变量中删除所有样式属性。我试图使用

someVar = $(someVar).find("*").removeAttr("style");

但是由于某种原因,这会删除大部分代码。它只返回10行左右,而其余部分则丢失了。如果我做以下

someVar = $(someVar).removeAttr("style");

它只删除第一个样式属性并返回其他所有内容(如预期的那样)。

someVar变量基本上是现有div的克隆

var someVar = $('someDiv#someID').clone();

编辑:只是为了澄清,我想从someVar变量中的所有子元素中删除样式attr

edit2:这是一个小人物 https://jsfiddle.net/pscs7ttp/

3 个答案:

答案 0 :(得分:4)

尝试;

$('#element').clone().attr('style', '');

这将删除克隆中的样式属性,而不是原始元素。如果要清理原始元素的属性;只需切换 clone attr 电话。

更新:如果要从所有子元素中删除所有样式属性,请使用; (注意 *

$('#element').removeAttr('style');  // remove style from self  
$('#element *').removeAttr('style'); // remove style from children

带变量

var variable = $('#element').clone();
// Remove children styles
variable.find('*').removeAttr('style');
// Remove self style
variable.removeAttr('style');

运行以下代码以查看是否删除了所有样式:
(取自@ MinusFour&#39的回答并修改)



$(function(){
  // Clone the element
  var variable = $('#element').clone();
  // Remove children styles
  variable.find('*').removeAttr('style');
  // Remove self style
  variable.removeAttr('style');
  // Output result to see if it works
  $('#result').text(variable.prop('outerHTML'));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<pre id="result"></pre>
<div id="element" style="padding:0;">
  <div style="padding:0;"></div>
  <div style="padding:0;"></div>
  <div style="padding:0;"></div>
  <div style="padding:0;"></div>
  <div style="padding:0;"></div>
  <div style="padding:0;"></div>
</div>
&#13;
&#13;
&#13;

答案 1 :(得分:1)

    $(someVar).find("[style]").each(function(){
        $(this).removeAttr("style"));
    })

答案 2 :(得分:0)

您可以使用each()迭代每个对象:

&#13;
&#13;
$(function(){
  $('#d').find('*').each(function(i, el){
    $(el).removeAttr('style');
    });
  $('#result').text($('#d').html());
  });
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<pre id="result"></pre>
<div id="d">
  <div style ="st"></div>
  <div style ="st"></div>
  <div style ="st"></div>
  <div style ="st"></div>
  <div style ="st"></div>
  <div style ="st"></div>
</div>
&#13;
&#13;
&#13;

请记住,find不会选择父对象(#d)。