JQueryを使用して、要素に境界線があるかどうかを確認します。

Question

私は$(el).css()で遊んでいるので、要素に境界線があるかどうかを判断しようとしています。

if ($(el).css("border-right-style") == "solid" && $(el).css("border-left-style") == "solid" && ...) {} 

：私は作品の境界線を設定する .css("border-style", "solid")を使用しますが、実際には4つの個々のスタイルを設定します：あなたが何かをしなければならないように

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

を、国境をチェックすると、少し面倒です

border-styleは常に ""と等しいので、単に$(el).css("border-style") != ""をチェックするだけでは機能しません。

これを行うもっとエレガントな方法はありますか？

Answer 1

border-styleそれが可能であればJquery CSS documentation

Shorthand CSS properties (e.g. margin, background, border) are not supported. 
For example, if you want to retrieve the rendered margin, 
use: $(elem).css('marginTop') and $(elem).css('marginRight'), and so on. 

Answer 2

4つのプロパティがすべて設定されているかどうかを知りたい場合は、4つのプロパティをチェックする必要があります。私はセレクタをキャッシュしますが。

$el = $('a'); 
if ($el.css("border-right-style") == "solid" && $el.css("border-left-style") == "solid" && $el.css("border-top-style") == "solid" && $el.css("border-bottom-style") == "solid") 
{ 
    alert('yay'); 
} 

jsFiddle

Answer 3

1として、私は知らないので、短縮形であり、あなたがseparatlyそれらを取得する必要があるので、あなたはそれらを一緒に得るカントあなたが試みていることをやってください。 DOMは、インラインまたはスクリプト内の要素に割り当てられた要素のスタイルのみを提供します。 CSS宣言からの境界線などのスタイルを継承しているかどうかはわかりません。

Answer 4

（

警告....それは継承されたCSSファイルからスタイル値を表示することができますあなたはまだ特性を試験するために持っていますが、これは、それはもう少し抽象的にすることができ...

function check(sel, prop) { 
    var i, property, $o = $(sel), directions = ["left", "right", "top", "bottom"]; 

    for (i = 0; i < directions.length; i++) { 
     property = $o.css(prop + '-' + directions[i] + '-style'); 
     if (property !== 'solid') { 
      return false; 
     } 
    } 

    return true; 
} 

Answer 5

$（ "selector"）。css（ "border-bottom-color"））;