attr怎么设置div显示

温馨提示：这篇文章已超过196天没有更新，请注意相关的内容是否还可用！

attr怎么设置div显示

attr()方法用于设置或返回被选元素的属性值。在网页开发中，可以使用attr()方法来设置div元素的显示。通过设置div元素的display属性，可以控制其显示方式。

当display属性的值为"none"时，div元素将不会显示在页面上；当display属性的值为其他合法的CSS属性值时，div元素将按照该属性值进行显示。

下面是一个示例代码，用于设置div元素的display属性为"block"，使其以块级元素的方式显示在页面上：


<!DOCTYPE html>
<html>
<head>
<style>
div {
  width: 200px;
  height: 200px;
  background-color: yellow;
}
</style>
</head>
<body>
<h2>使用attr()方法设置div显示</h2>
<button onclick="showDiv()">显示div</button>
<button onclick="hideDiv()">隐藏div</button>
<div id="myDiv"></div>
<script>
function showDiv() {
  document.getElementById("myDiv").style.display = "block";
}
function hideDiv() {
  document.getElementById("myDiv").style.display = "none";
}
</script>
</body>
</html>

在上述示例代码中，首先定义了一个div元素，并设置其初始的display属性为"none"，即初始状态下div元素不会显示在页面上。通过点击"显示div"按钮，调用showDiv()函数，将div元素的display属性设置为"block"，使其显示在页面上。而点击"隐藏div"按钮，调用hideDiv()函数，将div元素的display属性设置为"none"，使其不再显示。

除了"display"属性，还可以使用attr()方法设置其他CSS属性，如"width"、"height"、"background-color"等，以控制div元素的样式。通过结合相关的CSS知识，可以进一步扩展对attr()方法的应用，实现更多样式的设置和控制。

通过使用attr()方法，可以灵活地设置div元素的display属性，从而控制其显示方式。这为网页开发者提供了丰富的样式设置和页面布局的可能性。

attr怎么设置div显示

相关阅读