Question

我想从div中删除一些元素属性。我的div是自动生成的。我想遍历每个div和子div，并希望删除font-size (font-size: Xpx)内的所有size和font tag <font size="X">。

这些是我的div的例子。

<div id="headline" class="headline" style="position: word-break: break-all; background-color: rgb(90, 88, 84); width:300px;height:250px">
  <div style="text-align: center; font-size: 12px; color: rgb(1, 69, 18);">
    <div>
      <div>
        <font color="#ffffff" size="6" >
          <b>This is&nbsp;</b>
        </font>
        <b style="color: rgb(255, 255, 255); font-size: xx-large;">a Test&nbsp;</b>
      </div>
    </div>
    <div>
      <div>
        <b style="color: rgb(255, 255, 255); font-size: xx-large;">Demo&nbsp;</b>
      </div>
    </div>
    <div>
      <b style="color: rgb(255, 255, 255); font-size: xx-large;">csa</b>
    </div>
  </div>
</div>

OR

<div id="headline" class="headline" style="position: absolute; width: 186px; height: 50px; ">
  <div style="text-align: center; font-size: 12px; color: rgb(249, 249, 251);">
    <span style="color: rgb(255, 204, 153);">
      <font size="4">Expansion Pack</font>
    </span>
  </div>
</div>

我正在阅读像div这样的div。

$('#headline').find('*').each(function() {
    // font-size remove
    //size inside tag remove
});

但如果它们在子元素中，我怎么能删除字体大小和大小，有时只有font-size存在且没有<font>标记

Answer 1

我认为你需要更明确地选择你的选择器。这样的事情应该有效：

// Select all elements with a style attribute that contains font-size, and
// remove the inline font-size property
$('[style*="font-size"]').css('font-size', '');

// Select all font elements with a size attribute, and
// remove the size attribute
$('font[size]').removeAttr('size');

您可能希望使选择器更具体，以避免意外修改内容。例如：

$('#headline [style*="font-size"]').css('font-size', '');

注意：此解决方案使用jQuery attribute selectors。

编辑：查看Charlie关于效果的评论。属性选择器比大多数其他选择器慢得多，但我敢打赌，在大多数用例中，速度差异无关紧要。

Answer 2

尝试循环那些得到'font-size'的元素：

$('div').each(function(){
    $(this).css('font-size', '');  // set the value as empty string
)};

$('b').each(function(){
    $(this).css('font-size', ''); 
)};

请参阅jQuery Documentation on CSS。

从子元素

2 个答案: