Могу ли я использовать перенос слов в браузере из JavaScript? - PullRequest
4 голосов
/ 16 июня 2010

У меня есть текст в div.Это может быть любой текст Unicode под солнцем, включая китайский, японский и корейский.Теперь мне нужно взять этот текст и обернуть его в JavaScript эффективным, но правильным образом.Затем мне нужно вставить «>» в ​​начале каждой строки и поместить полученный текст в текстовую область.

Браузеры имеют реализацию алгоритма переноса слов в Unicode, о чем свидетельствует перенос Unicode с переносом словтекст с помощью CSS.(По крайней мере, Firefox имеет такой алгоритм, и я подозреваю, что и другие браузеры тоже.) Мне нужен какой-то способ для JavaScript использовать тот же алгоритм переноса слов, чтобы я мог правильно обернуть и затем «заключить в кавычки» текст Unicode.,

Есть ли способ для JavaScript использовать алгоритм переноса слов в браузере или узнать, где текст был разбит на строки в div или любом другом элементе?

1 Ответ

2 голосов
/ 16 июня 2010

То, что вы действительно хотите, не обязательно вставлять «>» в ​​поток текста в начале каждой строки.То, что вы действительно хотите, чтобы каждая строка в данном блоке имела «>» слева от него.

Возможно, вы можете сделать последнее следующим образом:

1) Создание изображения символа ">" с его высотой сверху вниз, эквивалентной значению CSS line-height, на которое вы планируетес помощью.Примените это изображение в качестве фона к контейнеру текста, в который вы хотите его «вставить».Повторите это вертикально, но не горизонтально.Заполните контейнер шириной символа / изображения.

2) Пусть некоторый javascript получит вычисленное значение свойства line-height для контейнера, с которым вы работаете.Затем, если вы не устанавливаете высоту этого контейнера искусственно, количество «строк» ​​текста в контейнере равно offsetHeight, деленному на вычисленную высоту строки.На этом этапе создайте отдельный контейнер, в котором нет ничего, кроме этого числа>.Поместите его к левому краю вашего контейнера содержимого.

Ваш большой вопрос о том, есть ли у вас доступ к алгоритму текстового потока, который браузер использует через JavaScript, интересен, но я почти уверен, что ответ - нет.Однако, поскольку все больше разработчиков начинают играть с элементом Canvas, люди пишут свои собственные (Canvas имеет рисование текста, но не имеет своего собственного алгоритма макета потока для текста).Возможно, вы захотите посмотреть, что сделали ребята из Беспина (https://bespin.mozillalabs.com/ - это текстовый редактор, реализованный с использованием Canvas) или проверить источник некоторых из библиотек javascript для создания мешков с песком / изображения, таких как jQSlickWrap (http://jwf.us/projects/jQSlickWrap/).

...