Hoe u een randbreedte krijgt in jQuery/javascript

Hoe kan ik de randbreedte ontleden van

style="border: solid 1px black;"

in jQuery/javascript?

$elem.css('border-width')

doet het niet.

Opmerking: ik moet de breedte van de css ontleden, aangezien het element display:none

kan zijn

Bedankt

BewerkenIk gebruik eigenlijk geen in-line stijl, ik heb het gewoon zo geschreven voor de eenvoud, omdat ik me niet realiseerde dat er enig gedragsverschil was. Het lijkt echter goed te werken voor inline-stijlen, maar kan nog steeds geen waarde halen uit een toegepaste css-klasse.


Antwoord 1, autoriteit 100%

U kunt gewoon parseInt();gebruiken om de randbreedte van Npxnaar Nte ontleden:

var width = $elem.css('borderWidth'); // 150px
var parsed = parseInt(width);         // 150

Ik had een Google in de buurt en het lijkt erop dat om de breedte van een rand te krijgen, je een expliciete kant van de rand moet opgeven:

var borderWidth = $elem.css("border-left-width");

Dit komt omdat het mogelijk is dat elke rand een andere maat, stijl en kleur heeft. Helaas lijkt het niet eenvoudiger dan dit.


Antwoord 2, autoriteit 9%

jQuery staat het gebruik van -niet toe bij het verwijzen naar een CSS-eigenschap, dus verwijder het streepje en gebruik de volgende letter als hoofdletter.

$elem.css('borderWidth');

Gecodeerd in jsFiddle om te demonstreren.


Antwoord 3, autoriteit 8%

var bordersOnBothSides = $("#measureMe").outerWidth() - $("#measureMe").innerWidth() );

Antwoord 4, autoriteit 7%

Om het antwoord van Generic aan te vullen bij het zoeken naar de linkergrens en om de opmerking van ongrijpbaar over radix toe te voegen:

<div style="border-style:solid;border-left-width:15px;"></div>

in script:

var width =parseInt($('div').css('borderLeftWidth'),10);
alert(width);

Antwoord 5, autoriteit 3%

Als je een gelijke randbreedte voor het element hebt, of als je een linker, bovenrandbreedte, gewoon js nodig hebt:

elem.clientLeft; //get left border of element
elem.clientTop; //get top border of element

Gebruik jQuery+css om de onderste rand goed te krijgen:

parseInt($(elem).css('borderLeftWidth'),10); // 10 use to get result in dec, not hex number system

Other episodes