Удалить ошибочные <br>теги из текстовой области - PullRequest
Новая
       37

Удалить ошибочные <br>теги из текстовой области

0 голосов
/ 10 июля 2019

Я использую текстовый редактор текстового редактора textarea в SharePoint 2013, и у него есть досадная привычка добавлять дополнительные теги разрыва в скрытую HTML-разметку в конце тегов, например: 

<h1>Some heading<br></h1>
<p>Intro paragraph with maybe an actual.<br>That is supposed to be here.</p>
<ul>
   <li>Item 1</li>
   <li>Item 2</li>
   <br>
   <br>
</ul>

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

Я хотел бы найти все теги br непосредственно перед любым другим закрывающим тегом и удалить их.

Мы могли бы использовать vanilla javascript, но jQuery уже есть на странице для других вещей.

Я нашел этот поток , который предоставляет решение для регулярного выражения для удаления br прямо перед темзакрытие h2.Это php и предоставляет больше алгоритм, чем реализация.Там есть второе решение «использовать парсер DOM».Но я не знаком с этим.

Кроме того, некоторые из добавленных тегов <br>, а некоторые <br />.И могут быть или не быть возвраты строки и пробелы.

Существует ли метод для нахождения всех <br> или <br /> непосредственно перед (игнорируя любые возвраты строки или пробелы) любого другого допустимого закрывающего тега?

Ответы [ 2 ]

3 голосов
/ 10 июля 2019

Использование jQuery для покрытия показанных случаев. Можно добавить к нему, как вы найдете другие случаи, не охваченные 

// get html string from main editor and put in temporary div
const $html = $('<div>').append($('#editor').html())
let ctr = 0; // counter for demo/debugging only

// hunt for unwanted culprits
$html.find('br').each(function() {
  const $br = $(this);
  // remove at end of parent OR more than one together OR is in a UL as child
  if (!this.nextSibling || $br.next().is('br') || $br.parent().is('ul')) {
    ctr++
    this.remove();
  }
})

console.log('removed =', ctr)

console.log($html.html())
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="editor">
  <h1>Some heading<br></h1>
  <p>Intro paragraph with maybe an actual.<br>That is supposed to be here.</p>
  <ul>
    <li>Item 1</li>
    <li>Item 2</li>
    <br>
    <br>
  </ul>
</div>
0 голосов
/ 10 июля 2019

Если в строке присутствует HTML-код, простая замена RegEx может удалить то, что вы хотите: 

htmlSourceCodeVar = htmlSourceCodeVar.replace(/<br(?: \/)?>(<\/)/ig, '$1');

Все, что соответствует RegEx, это все <br, за которыми необязательно следует /, а затем></;затем он заменяет его на начало этого закрывающего тега, тем самым удаляя разрыв.В этом случае вы также можете сделать это без обратных ссылок, так как начало закрывающего тега является постоянным и известным: 

htmlSourceCodeVar = htmlSourceCodeVar.replace(/<br(?: \/)?><\//ig, '</');
...