如何从element.style中删除多个css样式

Question

我的应用程序生成一些内联样式。在某些方面，我需要删除height，width和max-width风格。

我找到了这样的元素：

const elems = window.$('.myElements');
    window.$.each(elems, (index, value) => {
      if (value.id.startsWith('myPanel')) {

我试过这个：

         window.$(value).css({height: '', maxWidth: '', width: ''});

还有这个：

         window.$(value)[0].style.height = '';
         window.$(value)[0].style.width = '';
         window.$(value)[0].style.maxWidth = '';

这个：

         window.$(value).css('height', '');             
         window.$(value).css('max-width', '');
         window.$(value).css('width', '');
      }
    });

而且无论它总是只删除第一个元素。我在这里错过了什么？

Answer 1

您可以使用带选择器的启动，无需执行循环

  $('div[id^="myPanel"]').each( function () {

    $(this).css({
      height: Math.floor(Math.random()*200) + "px",
      width: Math.floor(Math.random()*200) + "px"
    });
  })

window.setTimeout( function () {
  $('div[id^="myPanel"]').css({
    height: '',
    maxWidth: '',
    width: ''
  });}
, 1000);

div {
  background-color: green;
  margin: 1em;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="myPanel1" style="width:20px; height: 20px;">A</div>
<div id="myPanel2" style="width:20px; height: 20px;">B</div>
<div id="myPanel3" style="width:20px; height: 20px;">C</div>
<div id="myPanel4" style="width:20px; height: 20px;">D</div>