2013-02-13 9 views
7

Ich möchte genaue Länge in Pixel von String wissen, d. H. "Hallo Welt".Get Zeichenfolge Länge in Pixel mit JavaScript

Es sollte nicht die Länge meines Containers sein.

Irgendwelche Hilfe ???

+1

* "Es sollte nicht die Länge meines Containers sein." * Wählen Sie den richtigen Container (z. B. eine Spannweite ohne Polsterung) und es gibt keinen Unterschied. –

Antwort

1

Sie können einige Inline-Element erstellen (span, zum Beispiel), setzen Sie die Zeichenfolge als Elementinhalt (innerHTML), es in das Dokument einfügen (bis zu einem gewissen Element anhängen) und bekommen es Breite ist (clientWidth).

Es gibt keine andere Möglichkeit, die Länge der Zeichenfolge in Pixeln zu messen, da dies vom Schriftstil abhängt.

5

Setzen Sie Ihren Text in eine <span> und verwenden Sie JavaScript, um die Breite Ihrer <span> zu messen.

HTML:

<span id="text">Dummy text</span> 

JavaScript:

var textWidth = document.getElementById("text").clientWidth; 

jQuery:

$('#text').width(); 
+0

Dies funktioniert nicht, wenn der 'span' einen CSS-Stil hat, der seine Breite beispielsweise auf' 100% 'setzt! – Andry

+0

Sie haben Recht @Andry. Ausnahme ist 'span' per Definition ein [Inline-Element] (https://developer.mozilla.org/en-US/docs/Web/HTML/Inline_elements). Dies bedeutet, dass Sie ihre Breite nicht definieren können, ohne ihre Anzeige z. 'Block' oder' Inline-Block'. – Mike

-2

Da die Pixellänge des Strings verändern wird abhängig von unabhängig voneinander angewendet CSS-Attribute wie Schriftart und Gewicht und Größe kann ich in JS nicht sehen.