javascript - 如何从 jquery 获取内联样式边框颜色？

Question

我有一个 html 标签，如下所示。

<span id="createOrderFormId:accountNo" style="border-color: red;"><</span>

我需要读取属性 border-color 的样式集，所以我使用了以下 jquery。

$( document ).ready(function() {
       var color = $('#createOrderFormId:accountNo').css('border-color');
        alert(color);
    });

但它没有显示，请帮助。

Answer 1

您可能需要在选择器中转义 :。

Live Demo

$( document ).ready(function() {
   var color = $('#createOrderFormId\\:accountNo').css('border-color');
    alert(color);
});

To use any of the meta-characters ( such as !"#$%&'()*+,./:;<=>?@[]^`{|}~ ) as a literal part of a name, it must be escaped with with two backslashes: \. For example, an element with id="foo.bar", can use the selector $("#foo\.bar"). The W3C CSS specification contains the complete set of rules regarding valid CSS selectors, Reference.

编辑 您可以使用 native javascript 属性 style.borderColor 您可以使用 .get() 或索引器从 jQuery 对象获取 DOM 对象。 native getElementById 可以与使用转义字符一起使用，这对我来说适用于 firefox。

Live Demo

$( document ).ready(function() {   
    alert( $('#createOrderFormId\\:accountNo')[0].style.borderColor);
    alert(document.getElementById('createOrderFormId:accountNo').style.borderColor);   
});