Как получить только прямой текст без тегов с помощью jQuery в HTML

Question

У меня есть HTML:

<strong>1)</strong>TEXT THAT I ONLY NEED<p>some par</p><ul>..</ul>

Мне нужен только "ТЕКСТ, КОТОРЫЙ Я ТОЛЬКО НУЖЕН" , который не содержит никаких тегов в его HTML, как я могу его получитьс jQuery?

Answer 1

Лучший способ - .clone() вашего объекта, .remove() всех его .children(), а затем вернуться к объекту с помощью .end() и, наконец, получить .text().

Метод описан в этом блоге .

$("strong")
        .clone()    //clone the element
        .children() //select all the children
        .remove()   //remove all the children
        .end()  //again go back to selected element
        .text();    //get the text of element

Answer 2

Это сложно, потому что текст находится в текстовом узле, а jQuery не поддерживает текстовые узлы, только элементы.Кроме того, поскольку разные браузеры по-разному обрабатывают пробелы в коде HTML, вы получаете разные наборы узлов в разных браузерах.Вы не можете просто получить узлы и полагаться на то, что нужный вам текстовый узел постоянно находится в одном и том же индексе.

Вы можете использовать jQuery, чтобы найти элемент, и использовать DOM, чтобы получить всеузлы внутри него.

Пример HTML:

<div id="test">
  <strong>1)</strong>
  TEXT THAT I ONLY NEED
  <p>some par</p>
  <ul>
    <li>asdf</li>
    <li>qwerty</li>
  </ul>
</div>

Используйте jQuery, чтобы найти div, используйте [0], чтобы получить элемент DOM из объекта jQuery, и свойство childNodesчтобы получить его потомков:

var nodes = $('#test')[0].childNodes;

Затем вы можете использовать jQuery для циклического перемещения по узлам, чтобы найти узел, являющийся элементом strong:

var index;
$.each(nodes, function(i,e){
  if (e.tagName == 'STRONG') {
    index = i;
    return false;
  }
});

Теперь вы можете использоватьDOM, чтобы получить текстовое значение из следующего узла:

var text = nodes[index + 1].nodeValue;

Answer 3

хорошо, если вы используете jQuery, вы бы сделали

$('.selector').text();

дополнительную информацию и примеры здесь

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

В этом случае я бы попытался изменить разметку (самый простой способ),поэтому нужный текст находится в тегах HTML.Если это невозможно, вы используете вышеупомянутый метод text(), чтобы получить весь текст из родительского элемента, и после того, как вам нужно будет вычесть ненужные фрагменты.

см. http://jsfiddle.net/3SSAR/1/для примера того, как вычесть строки ..

просто не забудьте использовать substr, а не - для вычитания строк в JavaScript

Answer 4

У меня работает этот код:

var el = $("<div/>");
el.html(text).children().remove();
return el.text();

Answer 5

var element = $('#element');
var tags = element.find('*');
tags.remove();
var plainText = element.text().trim();
alert(plainText); // prints TEXT THAT I ONLY NEED

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!-- html -->
<div id='element'>
  <strong>1)</strong>TEXT THAT I ONLY NEED
  <p>some par</p>
  <ul>..</ul>
</div>

Скрипка: https://jsfiddle.net/2b5dh4xc/

Answer 6

var name = $($(YourElementOuterHTML)).children().remove().end().text();

пример: -

var name = $($(li).find("a").get(0).outerHTML).children().remove().end().text(); 

Answer 7

Ваша разметка не самая лучшая для этого. Если вы завернули нужный текст с интервалом, например:

<span class="gettext">TEXT THAT I NEED</span>

Вы можете использовать $('.gettext').text(); в jQuery.