JavaScript——修改dom样式的三种方法

时间：2025-03-29 21:22:01

 html简单示例如下：

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>js修改文档样式</title>
</head>
<body>

  <div >这是一个盒子</div>

  <script type="text/javascript">

      var div = ("div");//获取元素id
      
      //方式一:用cssText

      ='width:600px;height:250px;border:1px red solid;
      text-align: center;line-height: 250px;';
      
      //方式二：用setProperty()

      ('width','700px');
      ('height','300px');
      ('line-height','300px');
      ('background','#f00');
      ('color','#fff');
      ('border','1px solid blue');
      ('text-align','center');
      
      //方式三：使用css属性对应的style属性
      
       = "800px";
       = "250px"; 
       = "250px"; 
       = "#000";
       = "#fff";
       = "1px solid #111";
       = "center";

  </script>
</body>
</html>

 

相关文章