如何动态改变DIV标签的CSS样式属性

How to dynamically change CSS style attribute of DIV tag?

本文关键字：标签 CSS 样式 属性 DIV 改变 何动态 动态      更新时间：2023-09-26

我们有一个div标签:<div id='div1' style="background-color:red"></div>

我想知道我们如何改变这个div标签的样式属性:-

  1. 我们可以清除样式值吗?

  2. 我们可以给现有的style属性附加值吗?

  3. 我们可以为style属性设置新的值吗

var div = document.getElementById('div1');
// Clear Value
div.setAttribute('style','');
  // OR
div.removeAttribute('style');
// Set Style / Append Style
div.style.backgroundColor = '#ff0000';

在添加或更改样式时不要直接修改style属性，除非您想要删除所有样式。

JavaScript removeAttribute: https://developer.mozilla.org/en-US/docs/Web/API/Element.removeAttributeJavascript样式:https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement.style

使用setAttribute()覆盖并在属性上添加新值。

var div = document.getElementById('div1');
// div.setAttribute('property', 'value');
div.setAttribute("style", "color: green; align:center;");

你可以使用js -

document.getElementById('#div1').style += "padding-top:40px";

您可以尝试这样做，例如:

$("#div1").css("property",'value');
相关文章：