Как достать текст из контейнера, но не включаю детей?

Question

[Артём Иннокентьев]

Такая разметка:

<p>
    <s>2</s>
    1
</p>

Надо вытащить 1 - какие способы через jQuery, JavaScript?

Answer 1

[Алексей Уколов]

На чистом js:

var p = document.getElementsByTagName('p')[0],
    text = '',
    child,
    index;

for (index = 0; index < p.childNodes.length; index++) {
    child = p.childNodes[index];
    
    if (child.nodeType == Node.TEXT_NODE)
    {     
        text += child.nodeValue;
    }
}

console.log(text);

Если необходимо, добавьте проверку на пустоту узла по вкусу. В приведенном коде два текстовых узла, например, один из которых состоит только из перевода каретки.

UPD: На самом деле, на пустоту можно не проверять и использовать метод trim(). Если нужна поддержка IE8-, есть полифил. Всё зависит от конкретной задачи и разметки.

UPD2: Разумеется, код на jQuery в 100500 раз медленнее, но реальная разница в производительности будет заметна только на гигантских объемах или очень-очень-очень медленных машинах, поэтому если в проекте уже используется jQuery, есть смысл использовать вариант, который предложил Денис, как самый читабельный.

Answer 2

[Денис]

<script>
var txt = $('p').clone().children().remove().end().text();
console.log(txt); // 1
</script>

Answer 3

[Wol_fi]

jQuery('p').each(function(){
   var nodeClone = $(this).clone();
   nodeClone.find('*').remove();
   var nodeText = nodeClone.text();
   console.log(nodeText);
});

Вот так например. За правильность метода не ручаюсь.