javascript - 从 jQuery 中的多个相同类名获取值 CSS

Question

如何从 jQuery 中的多个相同类名获取值 CSS？

也就是我有很多元素要录入数据库，

这些元素中的每一个都有不同的 CSS 值，

例如每个元素的CSS值为'background-image'，

我想获取每个元素的值并使用 Ajax 请求输入到数据库中，

问题，如何从该元素的每个数据中获取 CSS 值？

使用这个简单的例子

$('.content').each(function() {
  $('.result').html('isi1: ' + $(this).css('width') + ' ==== isi2: ' + $(this).css('width'));
});

span.content {
  display: inline-block;
  height: 100px;
  background: #666;
}

span.isi1 {
  width: 100px;
}

span.isi2 {
  width: 200px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="id_1">
  <span class="content isi1">ISI1</span>
  <span class="content isi2">ISI2</span>
</div>

<p class="result"></p>

编辑 https://jsfiddle.net/FIERMANDT/b1pq3p3z/

编辑 2020 年 7 月 21 日 VanilaJS 版本

/*for loop and getComputedStyle() method*/
var getEachCSSVal = document.querySelectorAll('.content');

for (var i = 0; i < getEachCSSVal.length; i++) {
  var cssVal = window.getComputedStyle(getEachCSSVal[i]).getPropertyValue('width');
  console.log(cssVal)
}

span.content {
  display: inline-block;
  height: 100px;
  background: #666;
}

span.isi1 {
  width: 100px;
}

span.isi2 {
  width: 200px;
}

<div id="id_1">
  <span class="content isi1">ISI1</span>
  <span class="content isi2">ISI2</span>
</div>

<p class="result"></p>

Answer 1

简单的控制台

$('.content').each(function(index){
console.log($(this).css('width'));
});

span.content {
  display: inline-block;
  height: 100px;
  background: #666;
}

span.isi1 {
  width: 100px;
}

span.isi2 {
  width: 200px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="id_1">
  <span class="content isi1">ISI1</span>
  <span class="content isi2">ISI2</span>
</div>
<p class="result"></p>