Как получить текст div, который не является частью какого-либо другого контейнера в JQuery?

Это должно быть очень легко. Ниже приведен HTML.

<div id='attachmentContainer'>
    #Attachment#
    <span id='spnAttachmentName' class='hidden'>#AttachmentName#</span>
    <span id='spnAttachmentPath' class='hidden'>#AttachmentPath#</span>
</div>  

Я хочу получить только # Приложение #, а не другой текст. Когда я попробовал

$("#attachmentContainer").text() 

он выдает все # Attachment #, # AttachmentName #, а также # AttachmentPath #. Я знаю, что могу просто добавить # Приложение # в другой диапазон и получить доступ к нему напрямую, но я просто заинтриговал, как это сделать. Любая помощь очень ценится.

Ответы

Ответ 1

Так как ваш текст является первым дочерним node <div>:

var firstChild = $("#attachmentContainer")[0].firstChild;
var textValue  = firstChild.nodeType == 3 ? $.trim(firstChild.nodeValue) : "";

Проверка nodeType должна быть защитой - она ​​гарантирует, что вы фактически обрабатываете текст node - firstChild может быть чем-то другим. Реагируйте соответственно, это всего лишь пример.

Чтобы получить значение всех дочерних элементов текста (или определенного), просто зациклируйте коллекцию childNodes вашего элемента, объединив все найденные биты в строку:

// the optional "at" parameter lets you define which text node you want
// if not given, this returns all text nodes concatenated
$.fn.ownText = function(at) { 
  var result = [], node = this[0];
  if (!(node && node.childNodes)) return;
  for (var i=0; i<node.childNodes.length; i++) {
    var child = node.childNodes[i];
    if (child.nodeType != 3) continue;
    var t = $.trim(child.nodeValue);
    if (t != '') result.push(t);
  }
  return at ? result[at-1] : result.join(' ');
}

var text = $("#attachmentContainer").ownText();  // all text children
var text = $("#attachmentContainer").ownText(1); // first text child only

Ответ 2

Это приведет к тому, что текст элемента

var $item = $("#attachmentContainer").clone();
$item.children().remove(); 
alert($item.text());

клонировать объект, поэтому вам не нужно удалять фактические элементы. Затем вы можете удалить дочерние элементы, и вы оставите внутренний текст этого элемента.

А вот удобный небольшой способ сделать это легко

jQuery.fn.trueText = function(obj){
    var $item = $(obj).clone();
    $item.children().remove(); 
    return $item.text();
};

Теперь вы можете позвонить $("#attachmentContainer").trueText()

Ответ 3

$('# attachmentContainer'). contents(). filter (function() {return this.nodeType == 3;}). text()

Ответ 4

Скопирован из мой собственный ответ на аналогичный поток

В этом примере используется .contents(), чтобы получить все дочерние узлы (включая текстовые узлы), затем использует .map(), чтобы превратить каждый дочерний node в строку на основе nodeType. Если node представляет собой текст node (т.е. Текст не в пределах промежутков), мы возвращаем его nodeValue.

Это возвращает набор jQuery, содержащий строки, поэтому мы вызываем .get(), чтобы получить "стандартный" массив, который мы можем назвать .join() on.

// our 'div' that contains your code:
var $html = $("<div id='attachmentContainer'>\n    #Attachment#\n    <span id='spnAttachmentName' class='hidden'>#AttachmentName#</span>\n    <span id='spnAttachmentPath' class='hidden'>#AttachmentPath#</span>\n</div>");

// Map the contents() into strings
$html.contents().map(function() { 
  // if the node is a textNode, use its nodeValue, otherwise empty string
  return this.nodeType == 3 ? this.nodeValue : ''; 
  // get the array, and join it together:
}).get().join('');

// " 
//     #Attachment# 
//     
//     
// "

Если вы хотите обрезать лишние пробелы, вы можете использовать $.trim(this.nodeValue)

Если вам нужно сделать это много, вы даже можете сделать плагин (теперь с некоторыми опциями):

$.fn.directText = function(settings) {
   settings = $.extend({},$.fn.directText.defaults, settings);
   return this.contents().map(function() {
     if (this.nodeType != 3) return undefined; // remove non-text nodes
     var value = this.nodeValue;
     if (settings.trim) value = $.trim(value);
     if (!value.length) return undefined; // remove zero-length text nodes
     return value;
   }).get().join(settings.joinText);
};

$.fn.directText.defaults = {
   trim: true,
   joinText: ''
};

Ответ 5

Я думаю, что текст на самом деле является текстовым элементом - дочерним элементом родительского div. Поэтому вам просто нужно запросить первого ребенка. Не уверен, хотя. HTH

Ответ 6

Я думаю, что надлежащим образом сформированный угол будет заключаться в том, чтобы поставить первую часть в <p> </p> (если диапазон не подходит).

Я думал, что смогу получить .filter, чтобы работать над ним, но не мог получить его...