W3School TIY Editor
W3School 在线教程
改变方向
暗黑模式
运行代码
<!DOCTYPE html> <html> <head> <style> #content { height: 100px; width: 100px; background-color: coral; padding: 15px; border: 10px solid black; margin: 10px; overflow: scroll; } </style> </head> <body> <h1>Element 对象</h1> <h2>scrollHeight 和 scrollWidth 属性</h2> <button onclick="myFunction()">调整</button> <p>单击“调整”将“内容”的宽度和高度设置为从 scrollHeight 和 scrollWidth 返回的值。</p> <div id="content">一些内容..一些内容..一些内容..一些内容..一些内容..一些内容..一些内容..一些内容..一些内容..一些内容..一些内容..一些内容..一些内容..一些内容..一些内容..一些内容..一些内容..一些内容..一些内容..一些内容..一些内容..一些内容..一些内容..一些内容..一些内容..一些内容..一些内容..一些内容..一些内容..一些内容..一些内容..一些内容..一些内容..</div> <script> function myFunction() { const element = document.getElementById("content"); element.style.height = element.scrollHeight + "px"; element.style.width = element.scrollWidth + "px"; } </script> </body> </html>