如何从这个CSS中提取价值

Question

我实际上想要在jquery中提取所选的数量但是因为CSS类中的一个字符串（在图像中以黄色突出显示）在每个产品中都会发生变化。因此对于本页面的一些访问者来说，拥有iphone 7选择的类名可能是

  

按钮 - 选择ng-tns- c43 -1

和其他使用不同产品类名称浏览的人可以

  

按钮 - 选择ng-tns- c26 -1

Answer 1

诀窍是提取整个DOM的所有类，然后搜索它们并找到以ng-tns-开头的类。

var values = [];
var allClasses = [];
var allElements = document.querySelectorAll('*');

for (var i = 0; i < allElements.length; i += 1) {
  var classes = allElements[i].className.split(/\s+/);

  for (var j = 0; j < classes.length; j++) {
    var cls = classes[j];

    if (cls && allClasses.indexOf(cls) === -1) {
      allClasses.push(cls);

      if (cls.startsWith('ng-tns-')) {
        var ngTns = document.getElementsByClassName(cls);

        for (var k = 0; k < ngTns.length; k += 1) {
          if (ngTns[k].hasAttribute('is-selected')) {
            values.push(ngTns[k].innerText);
          }
        }
      }
    }
  }
}

console.log(values);

<div class="button--select">
  <span class="ng-tns-c43-1">500</span>
  <span class="ng-tns-c43-1" is-selected>200</span>
  <span class="ng-tns-c43-1">100</span>
</div>