Выберите первый текстовый узел в этой разметке

Question

Я пытаюсь выбрать первый текстовый узел в первом li в этом упорядоченном списке ...

<ol id="authors">
  <li id="CD007786-cr-0002">Robert S Phillips<sup>1,*</sup>, </li>
  <li id="CD007786-cr-0003">Shireen Gopaul<sup>2</sup>, </li><li id="CD007786-cr-0004">Faith Gibson<sup>3</sup>, </li>

Пока что я пробовал:

jQuery("ol#authors li:first-child").text()

Но это возвращает:

Robert S Phillips1,*, 

То, что я пытаюсь получить, просто:

Robert S Phillips

Answer 1

Попробуйте

alert( jQuery("#authors li:first-child").contents().get(0).nodeValue );

Answer 2

Легче получить текстовые узлы с обычным javascript, на самом деле получить правильный узел просто так просто, как

var node = document.querySelector('#authors li').firstChild;

Чтобы получить значение

var text = node.nodeValue;

FIDDLE

Answer 3

это будет сделано

var $first = $("#authors li:first-child").clone();
$first.find("sup").remove();
var fullName = $first.text().trim().replace(/,$/, "");

нажмите здесь для скрипки

в идеале, я бы изменил структуру разметки на

<ol id="authors">
  <li id="CD007786-cr-0002"><span class="fullName">Robert S Phillips</span><sup>1,*</sup>, </li>
  <....>
</ol>

и затем извлеките имя с помощью

$("#authors li:first-child span.fullName").text();