如何使用Javascript获得多行文本的行宽

Question

行f.e。：

    <p style="width: 300px;">asdasd sa das d asd a sd as das dasdasdasdasd saddasdasdasdasd asdasdsd</p>

P的宽度为300px，但每行都较小。我需要为每一行计算它。 屏幕： multiline block

Answer 1

我不知道js方式，但是您可以使用jQuery：

   <p id="demo" style="white-space:pre">
    Line 1

    Line 2

    Line 3

    Line 4 Blah

    Line 5
    </p>

JQUERY：

  $(function(){
var text =  $.trim($('#demo').text());
// this may vary browser to browser...
var text_w_no_empty_lines = text.replace(/[\r\n]+/g, '\n');
var lines = text_w_no_empty_lines.split('\n');
// line number you want  total - 1
var line_5 = lines[4];
// .tick { white-space:nowrap;display:inline-block;display:none }
alert( $('<p class="tick">').html(line_5).appendTo('body').width() )
}
);