Word Wrap: лучший инструмент для форматирования текста

Word wrap - это процесс форматирования текста на экране, который позволяет автоматически переносить текст в новую строку, когда он выходит за границы доступного пространства. Это делается для того, чтобы текст был читабельным и не требовал горизонтального прокручивания.

Пример кода на языке JavaScript для реализации word wrap для HTML-элемента:

javascript
function wordWrap(element, maxWidth) {
  let words = element.textContent.split(' '); // разбиваем текст на слова
  let line = '';
  for (let i = 0; i < words.length; i++) {
    let testLine = line + words[i] + ' ';
    let testWidth = element.getContext('2d').measureText(testLine).width; // определяем ширину строки
    if (testWidth > maxWidth && i > 0) {
      element.textContent = line.trim(); // убираем пробелы у начала и конца строки
      line = words[i] + ' ';
    } else {
      line = testLine;
    }
  }
  element.textContent = line.trim(); // обрабатываем последнюю строку
}

В данном примере функция wordWrap принимает в качестве аргументов элемент, содержащий текст, и максимальную ширину для каждой строки. Функция разбивает текст на слова, затем генерирует новые строки до тех пор, пока не достигнет максимальной ширины. При этом происходит перенос слов на следующую строку, а пробелы удаляются у начала и конца каждой строки. Результатом работы функции является обновленный элемент с корректно обернутым текстом.