javascript - 在 css 中设置固定大小并在 javascript 中使用它

Question

我是 CSS 和 javascript 的新手，并尝试查看其他消息，但找不到我的问题的答案。

我想预先在 css 中设置我所有的部分大小，然后在 javascript 中使用这些部分。但是 .width 和 .height javascripts 使用的属性不是 .css 文件中的硬编码大小，而是元素在执行脚本的当前行的大小。

我的 html 部分如下所示:

       <div id="raw">
         <p id="add">Add a new data value</p>
         <p id="remove">Remove a data value</p>

        <script src = "javascripts/dynamic_bars.js"></script>

       </div>        

部分 CSS 如下所示:

#raw{ position:relative；向左飘浮;宽度:100%；最小高度:80%；

在 dynamic_bars.js 中，我尝试获取原始 ID 元素的宽度:

var h = document.getElementById('raw').scrollHeight;

控制台日志(h);

var w = ($(this).width() * 0.8);
var h = ($(this).height()/3) ;

scrollHeight 只是我添加和删除文本(

元素)的高度

$this.height 有效，但那是整个屏幕的高度，不是我的原始元素的高度。

如果我使用 DOM 检查器，我可以看到我的原始部分的高度确实是其父级的 80%。但是当 javascript 运行时(在原始部分中创建 svg 元素)它只有之前添加的

元素的大小。

有没有办法在 javascript 中获取 CSS 的 min-height 属性？？

Answer 1

使用 .css() 功能。

例如:

$("#raw").css("height");

在这种情况下，如果您在 css 中将高度属性设置为 100 像素，则 javascript 也将获得 100 像素。