从元素jQuery获取内联css宽度属性

Question

我有这个元素：

<div class="progress xs" style="margin-bottom: 0px; height: 3px;">
    <div class="progress-bar progress-bar-green" style="width: 100%;"></div>   
</div>

我想获得内联 css属性宽度。

我试图这样做：

$(".progress").find(".progress-bar").css('width');

哪个应该返回 ' 100%' 但返回638px。
正如你在我的例子中看到的：

<div class="progress xs" style="margin-bottom: 0px; height: 3px;">
    <div class="progress-bar progress-bar-green" style="width: 100%;"></div>   
</div>

$(".progress").find(".progress-bar").css('width');

没有人知道如何得到100%的的progress-bar元素吗？

Answer 1

您可以直接访问style元素的属性来获取定义的宽度。

console.log($(".progress").find(".progress-bar").css('width'));
console.log($(".progress").find(".progress-bar")[0].style.width);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="progress xs" style="margin-bottom: 0px; height: 3px;">
  <div class="progress-bar progress-bar-green" style="width: 100%;"></div>
</div>