Wie bekomme ich die Höhe von "br" Element mit jquery?

Question

Ich versuche, die Höhe von <br /> auf meiner Webseite zu bekommen. Ich benutze diesen Ausschnitt.

br_size = $('br').height(); 
console.log(br_size); 

Aber nur die Mozilla Firefox wie dieser Code, alle anderen Browser geben 0 zurück Gibt es einen kurzen JS-Code, zurück, um mir die richtige Höhe gibt?

PS: Ich benutze diese Methode, weil ich weiß, dass die benötigte Größe X ist X= other_size - 4*br_size

Answer 1

Der Zeilenumbruch ist abhängig von der Zeilenhöhe in den HTML/BODY-Tags angegeben, wenn man dem Browser ihre eigenen wahrscheinlich nicht angegeben wird dann verwendet wird. Wenn Sie jedoch eine Zeilenhöhe angeben, z. B. 20px, sollte der Zeilenumbruch 20px betragen. Sie könnten wahrscheinlich JavaScript verwenden, um die Standard-line-height

(function() { 
 
    var br = document.getElementById('foo'); 
 
    alert(br.scrollHeight); 
 
    if (br.currentStyle) { 
 
    alert(br.currentStyle['lineHeight']); 
 
    } else { 
 
    alert(document.defaultView.getComputedStyle(br, null).getPropertyValue('line-height')); 
 
    } 
 
})();

<br id="foo" />

Answer 2

Wie wäre es outerHeight?

$('br').outerHeight(); 

https://jsfiddle.net/6fag6tos/

Answer 3

Es ist nicht zu bestimmen scheinen <br>height Eigenschaft hat. Auch Sie können es nicht in der Höhe des Browsers sehen. Wenn es eine andere elemetn nach <br> ist, können Sie diesen Code verwenden:

var height = $("br").next().position().top - $("br").position().top 
 
console.log(height);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<p>Hello</p> 
 
<br/> 
 
<p>Goodbye</p>

Answer 4

Versuchen this. Funktioniert auf Chrom.

var br = $('br').first(); 
var div = $('<div>Text</div>'); 

div.css({ 
    'font-size': br.css('font-size'), 
    'line-height': br.css('line-height'), 
    'position': 'fixed', 
    'visibility': 'hidden', 
}); 

$('body').append(div); 

alert(div.outerHeight()); 

div.remove();