小编Raj*_*ore的帖子

有没有办法获取应用于特定html元素的仅用户定义的计算css样式列表.样式可以通过外部css文件或嵌入/内联样式以任何方式应用.

.p1{font-size:14px; line-height:20px;}

<style>
  .p1{ line-height:18px; color:green;}
</style>
<p class="p1" style="color:red;">Some Paragraph</p>

现在我需要的列表是应用于元素的唯一用户定义的计算样式,而不是包含由window.getComputedStyle()提供的空白/ null/default-values的整组计算样式

为了更准确地解决我的问题,我想首先介绍一个我访问网站的场景,我想使用开发人员工具栏以编程方式获取唯一的用户定义样式(或者通过在控制台上编写一些脚本) .因此,考虑到这种情况,我要求的最终产出应该是 -

{
  'color':'red',
  'line-height' : '18px',
  'font-size' : '14px'  
}

如果需要,请纠正我的疑问或解释中的任何错误.

我想知道为什么下面的JS Fiddle在chrome中运行良好而在Firefox中运行良好的原因.尽管在按钮内嵌入复选框可能是错误的,但我只想知道在我的JS Fiddle的上下文中使用chrome和firefox之间的差异理论背后的理论.

JS小提琴

$(function(){    
    $("button.tablesaw-sortable-btn").on("click",function(){        
        alert("button clicked");        
    });
    $("input#test").on("click",function(e){        
        e.stopPropagation();
    });
});

.selector {
    $width: '10px';
    width: (#{$width}/2); // output: "10px", but expected: 5px
}

上面的代码是不言自明的。请纠正我。