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

$("p,h1,h2,h3,h4,h5,h6").each(function() {
    var wordArray = $(this).text().split(" ");
    var finalTitle = "";
    for (i=0;i<=wordArray.length-1;i++) {
        finalTitle += wordArray[i];
        if (i == (wordArray.length-2)) {
            finalTitle += "&nbsp;";
        } else { 
            finalTitle += " ";
        }
    }
    $(this).html(finalTitle);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. <a href="test.php">It has survived</a> not only five centuries, but also the leap into electronic typesetting.</p>
<p> only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software.</p>
3
R Reveley 13 Дек 2016 в 16:39

3 ответа

Лучший ответ

Попробуйте использовать html() вместо text():

$("p,h1,h2,h3,h4,h5,h6").each(function(i,e) {
  var text = $(e).html();
  text = text.split(' ');
  var lastWord = text.pop();
  text = text.join(' ') + "&nbsp;" + lastWord;
  $(e).html(text);
});

играть на скрипке

Кстати, есть один угловой случай, для которого он не работает, и это когда последнее одиночное слово элемента, которое должно быть разорвано, находится внутри <a> или любого другого тега с атрибутами, например:

<p>Lorem ipsum dolor sit <a href="">amet.</a></p>
3
wscourge 13 Дек 2016 в 14:53

Проблема заключается в том, что вы используете .text(), который получает объединенный текст элемента и его потомков, а не сами элементы-потомки, поэтому, когда вы заменяете HTML чем-то, сгенерированным из этого, он не включает их.

Возможно, вам повезет больше, если использовать .contents(), взять последний узел text и заменить его на узел text, элемент &nbsp; и узел text, представляющий последнее слово

2
SpoonMeiser 14 Дек 2016 в 11:34
    function noMoreLonelyWords(selector, numWords){

      // Get array of all the selected elements
      var elems = document.querySelectorAll(selector);
      var i;
      for(i = 0; i < elems.length; ++i){

        // Split the text content of each element into an array
        var textArray = elems[i].innerText.split(" ");

        // Remove the last n words and join them with a none breaking space
        var lastWords = textArray.splice(-numWords, numWords).join("&nbsp;");

        // Join it all back together and replace the existing
        // text with the new text
        var textMinusLastWords = textArray.join(" ");
        elems[i].innerHTML = textMinusLastWords + " " +  lastWords;
      }
    }

    // Goodbye lonely words
    noMoreLonelyWords("p", 2);
<div class="onePar">
  <p>This is an example page. It’s different from a blog post because it will stay in one place and will show up in your site navigation (in most themes). Most people start with an About page that introduces them to potential site visitors. It might say
    something like this:
  </p>
</div>

<div class="twoPar">
  <p>This is an example page. It’s different from a blog post because it will stay in one place and will show up in your site navigation (in most themes). Most people start with an About page that introduces them to potential site visitors. It might say
    something like this:
  </p>
</div>
0
MistaPrime 23 Окт 2019 в 19:52