Overview
The Text Children Plugin is a simple little jQuery plugin to return textual content from selected elements. Unlike jQuery's built-in .text() method, the textChildren plugin does not recurse through the selected elements' descendants.
If you like this plugin and you're feeling generous, perhaps you'd also like to visit my amazon.com wish list?
Quick Start Guide
The Text Children Plugin returns a concatenated string by default, as .text() does, but can include an optional delimiter, such as a comma or a space, between text nodes. It can also return an array if you prefer that. Each text node's string is trimmed by default, but this feature can be turned off if desired.
<ul id="testlist">
<li>Although <strong>she claimed that</strong> someone <em>stopped by
for a visit, </em><span class="highlight">she swore
that he never</span> slept here
</li>
<li><strong>The rains came down</strong> for forty years
</li>
<li><em>James said</em> he <em>never</em> felt <span class="highlight">that he was</span>
better <strong>at chess</strong> than his son.
</li>
</ul>
<head> of your document. After these scripts are referenced, you can reference a custom script file to return the desired text nodes (preferred) or enter the script directly in the <head> (shown below).<script src="jquery-latest.js" type="text/javascript"></script>
<script src="jquery.Text Children.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
// simple example, using all default options
var test1 = $('#testlist li').textChildren();
/* test1 == "Althoughsomeoneslept herefor forty yearshefeltbetterthan his son." */
// *** OR ***
// use a filter or override some default options
var test2 = $('#testlist li').textChildren(0);
/* test2 == "Althoughfor forty yearshe" */
var test3 = $('#testlist li').textChildren({stringDelimiter: ' '});
/* test3 == "Although someone slept here for forty years he felt better than his son." */
var test4 = $('#testlist li').textChildren({outputType: 'array'});
/* test4 == ["Although", "someone", "slept here", "for forty years", "he", "felt", "better", "than his son."] */
});
</script>
See API / Options for more ways to customize the behavior and appearance of the Text Children.
Text Children Plugin API / Options
The Text Children Plugin API provides a single method with a few options.
The plugin is still in its infancy, so do not hesitate to send bug reports or feature requests to the jQuery Google Group.
textChildren(n, options)- (Both
nandoptionsare optional) - Returns the text contents of the matched set of elements.
- To be precise, the plugin finds all child nodes (but no grandchild, great-grandhild nodes, etc.) of the selected element(s) and checks to see if they are text nodes. If they are, their contents are returned.
The "nth" Filter
n is a filter for the text child nodes. If the argument is not entered, the contents of all text child nodes are returned. To return the first text node's contents, use 0 or 'first'. To return the last text node's contents, use -1 or 'last'. If n fails to match a text node, an empty string is returned (or an empty array, if outputType is set to 'array').
Available options
$.fn.textChildren.defaults = {
outputType: 'string', // one of 'string' or 'array'
stringDelimiter: '', // if outputting to string, inserts a delimiter between nodes
trim: true // whether to trim white space from start/end of text nodes
};
Demo
You can test this plugin below against the following HTML:
<ul id="testlist">
<li>Although <strong>she claimed that</strong> someone <em>stopped by
for a visit, </em><span class="highlight">she swore
that he never</span> slept here</li>
<li><strong>The rains came down</strong> for forty years</li>
<li><em>James said</em> he <em>never</em> felt <span class="highlight">that he was</span>
better <strong>at chess</strong> than his son.</li>
</ul>
- Although she claimed that someone stopped by for a visit, she swore that he never slept here
- The rains came down for forty years
- James said he never felt that he was better at chess than his son.
Build your code
See the jQuery
View the Result
Download
The Text Children Plugin is available at: http://plugins.learningjquery.com/textchildren/jquery.textchildren.js.Support
Support for the Text Children Plugin is available through the jQuery Mailing List. This is a very active list to which many jQuery developers and users subscribe.