Firefox 14.0.1のjQueryでCSS境界値を取得する

Question

Firebugコンソールで次のコードを実行します。

$('img').css('border', 'solid 2px red').css('border'); 

赤いイメージの罫線が表示されますが、空の文字列が返されます。これはどうしてですか？

ChromeとSafariの開発ツールでうまく機能します。

更新：jQueryドキュメントでは、CSS値を取得する際に省略形のプロパティはサポートされていないと言います。しかし、私はまた、.cssドキュメントを引用

$('img').css('border-style', 'solid').css('border-style'); 
$('img').css('borderStyle', 'solid').css('borderStyle'); 
$('img').css('border', 'solid 2px green').css('borderStyle'); 

Answer 1

Firefoxで運（ChromeとSafariですべての作業）で、以下を試してみました。

速記CSS特性（例えば、マージン、バックグラウンド、境界）がサポートされていません。たとえば、レンダリングされたマージンを取得する場合は、$(elem).css('marginTop')と$(elem).css('marginRight')などを使用します。​​の場合には

、あなたはborder-width、border-styleとborder-color関連のプロパティを使用する必要があります。

border-color：Firefoxで

$('img').css('border-top-color', 'red').css('borderTopColor'); 
$('img').css('border-right-color', 'red').css('borderRightColor'); 
$('img').css('border-bottom-color', 'red').css('borderBottomColor'); 
$('img').css('border-left-color', 'red').css('borderLeftColor'); 

Answer 2

サポートされているプロパティ：

'border-top-color' 
'border-right-color' 
'border-bottom-color' 
'border-left-color' 

'border-top-width' 
'border-right-width' 
'border-bottom-width' 
'border-left-width' 

'border-top-style' 
'border-right-style' 
'border-bottom-style' 
'border-left-style' 

はサポートlonghands :)乾杯です！楽しい！！！

ほとんどの場合、省略形を使用して枠線を設定できます。

あなたは彼らが同じであることを確認している場合2px solid rgb(255,255,255)'

Answer 3

」のような文字列を取得するために

var borderString = $('img').css('border-top-width') + " " 
       + $('img').css('border-top-style') + " " 
       + $('img').css('border-top-color'); 

ような何かを、おそらくあなたは は、次の構文

を使用する複数のプロパティを使用しようとしています$（ 'img'）.css（{'border'： 'solid 2px red'、 'color'： 'green'}）

省略表現のプロパティはサポートされていませんJqueryでorted。

Answer 4

var objImage = $('img').css('border', 'solid 2px red'); 
objImage.css('border-top-color'); 
objImage.css('border-top-width'); 
objImage.css('border-top-style'); 

だけではないtopのために、それはright、left、およびbottomためにも適用可能です。

これはまた、非作業コードです：

objImage.css('border-style'); 

margin、borderので、CSSのpadding性質は別途編集可能です。border-topがborder-leftと異なる場合は、ブラウザはあなただけborderを尋ねられたとき、それは返す必要が混同されることがあります。

Answer 5

これ試してみてください：CSS（ 'ボーダースタイル'）私も `$（ 'IMG'）を試してみましたCSS（ 'ボーダースタイル'、 '固体'）

var border = $('img').css('border', '2px solid red')[0].style.border; 

FIDDLE