Firefox、Edge下无法使用jQuery的css("margin")、css("padding”)和css("border")获取值

今天遇到了浏览器的迷惑行为，在Edge上使用jQuery的css("margin")获取值，发现获取的是空值，换了Firefox也是如此。

看了jquery官方原话，发现如下一段话

Retrieval of shorthand CSS properties (e.g., margin, background, border), although functional with some browsers, is not guaranteed. For example, if you want to retrieve the rendered border-width, use: $( elem ).css( "borderTopWidth" ), $( elem ).css( "borderBottomWidth" ), and so on.

意思就是说：使用简略css属性表示法（比如mangin、padding这些），在某些浏览器上可能不起作用（直接点名Firefox、Edge），要获取的话，使用$( elem ).css( "borderTopWidth" ), $( elem ).css( "borderBottomWidth" )等等这些方式吧。

 

正确获取方法：

$('.element').css('margin-top')、

$('.element').css('margin-bottom')

......

and so on