Question

我有一个PDF，我通过PDFtoHTML来创建一个我可以操作的HTML页面。我想根据单一颜色rgb（0,129,162）选择多个标题，因为这似乎是区分标题与文本其余部分的唯一可辨别方式。有一个样式元素将颜色应用于head元素中应用颜色的所有span和div元素。

span.cls_022{font-family:Arial,serif;font-size:11.1px;color:rgb(0, 129, 162);font-weight:normal;font-style:normal:text-decoration: none}

HTML如下所示：

<div style="left: 72.02px; top: 204.98px; position: absolute">
  <div class="cls_022" style="left: 72.02px; top: 204.98px; position:absolute;">
    <span class="cls_022">Text I'd like to select</span>
  </div>
</div>

现在，我可以选择并返回包含

的span的样式元素

document.getElementsByClassName("cls_022")[0].style.cssText

这将返回标签内的样式。

在开发工具中，我可以看到它的颜色属性为rgb（0,129,162），这就是我想用来选择和返回CSS COLOR PROPERTY的值。

有什么想法吗？

Answer 1

这可以达到你想要的效果：

            var $carousel = $('.carousel');

            var dirFlag = false;

            setInterval(function(){
                dirFlag = !dirFlag;
                if(dirFlag == true) {
                    $carousel.carousel('next');
                } else {
                    $carousel.carousel('prev');
                }
            }, 5000);

＆＃13;

var elem = document.getElementsByClassName("cls_022")[1];
var cssColor = window.getComputedStyle(elem, null).getPropertyValue("color");

＆＃13;

var targetElems = document.querySelectorAll("span.cls_022");
//targetElems.forEach(el => console.log(el));
//console.log(targetElems);  //<--- If there are no spans with other color, and this is what you want, querySelectorAll return a NodeList.

let blueTitles = [];
targetElems.forEach(el => {
   if(window.getComputedStyle(el, null).getPropertyValue("color") === 'rgb(0, 129, 162)') {
       blueTitles.push(el);
   }
});

//console.log(blueTitles);  // <---- blueTitles is an array only contains spans with class "cls_022" and color rgb(0, 129, 162)

＆＃13;

span.cls_022 {
  font-family: Arial, serif;
  font-size: 11.1px;
  color: rgb(0, 129, 162);
  font-weight: normal;
  font-style: normal:text-decoration: none
}

span.red {
    color: red;
}

＆＃13;

如何使用Javascript返回CSS颜色元素的值？

1 个答案: