@creately/inner-text

inner-text

Cross Browser innerText function based on innerHTML with replacements.

innerText is a function, that is not standardized, but Chrome and IE support. Firefox doesn't.

There is different ways to implement the innerText functionality.

You can get a selection window.getSelection(), select all the elements selection.selectAllChildren(el) and call selection.toString().

The problem is, that it is based on the user selection, and you can mess it up.

If you want to go this route: inner-text-shim is for you.

Otherwise this function can be helpful.

install

npm install @creately/inner-text

usage

All innerText does is get the el.innerText from the element, even when the browser does not support it. You can pass an html element or a string with html as input to this function. you can't set the innerText with this module.

var innerText = require('inner-text');

// get the dom element with plain javascript
var el = document.querySelector('body');
// or with jquery:
el = $('body')[0];

// set the innerHTML (only for this example)
el.innerHTML = 'hello<br/>world';

var text = innerText(el)
assert.equal(text, 'hello\nworld');

You can specify the tags to replace with

el.innerHTML = 'hello<p>world</p>';
var text = innerText(el)
assert.equal(text, 'hello\nworld');

el.innerHTML = 'hello<div>world</div>';
var text = innerText(el, { tags: { div : '\n' }} )
assert.equal(text, 'hello\nworld');

el.innerHTML = 'hello<p>world</p>';
var text = innerText(el, { tags: { p : '\n' }})
assert.equal(text, 'helloworld');

el.innerHTML = 'hello<p>world</p>hi<p>there</p>';
var text = innerText(el, { tags: { p : '\n', div : '\n\n' }})
assert.equal(text, 'hello\nworldhi\n\nthere');

test

npm test

license

MIT

author

Andi Neck | @andineck