Обоснуйте текст с определенным номером символа с помощью JS

Я хочу, чтобы оправдать текст на 80 символов в строке. Слова не должны быть обрезаны, поэтому не все строки будут иметь 80 символов, поэтому я должен добавить пробел между словами в этой ситуации или просто оправдать строку. Итак, я выбрал второе решение и вот оно:

<style>
    .fulljustify {
        text-align: justify;
    }
    .fulljustify:after {
        content: "";
        display: inline-block;
        width: 100%;
    }
</style>

<div>
    <textarea id='strtxt' rows="30" cols="90"></textarea>
    <br>
    <button onclick="myFunction()">Justify</button>
    <br>
    <div id="splitText" style="width: 45%; height: 150px;"></div>
</div>

<script>

    function myFunction() {
        var str = document.getElementById("strtxt").value;

        var result = stringDivider(str, 80, "<p class='fulljustify'>", "</p>");
        document.getElementById("splitText").innerHTML = result;
    }

    function stringDivider(str, width, prefix, postfix) {
        var text = [];
        if (str.length>width) {
            var p = width;
            for (;p>0 && !/\s/.test(str[p]); p--) {
            }
            if (p>0) {
                var left = str.substring(0, p);
                //var a = (left.split(" ").length - 1);
                var b = width - left.length;
                var a = prefix+left+postfix;
                text.push(a);
                var right = str.substring(p+1);
                return text + stringDivider(right, width, prefix, postfix);
            }
        }
        return "<p>"+str+postfix;
    }

</script>

Это решение делит текст на небольшие тексты в виде абзацев, а затем выравнивает их как блоки. Но между линиями слишком много места, как вы можете видеть на этой картинке: введите описание изображения здесь

Есть ли другое решение, лучшее, чем это? поделитесь пожалуйста

0 ответов

Другие вопросы по тегам