Как получить текст 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, чтобы работать над ним, но не мог получить его...