Textcontent and innertext

Innertext is a private Implementation of IE, but it is also implemented by browsers other than ff. textcontent is the W3C standard API. Now ie9 is also implemented.

There are only two differences between them.

1. Innertext cannot return the source code in the script label. textcontent can be used instead of text and innerhtml in browsers that do not support textcontent.
2. Textcontent retains blank lines, spaces, and line breaks. innertext retains only line breaks.

To avoid the differences between the two, foreigners write the following script:

// Http://clubajax.org/plain-text-vs-innertext-vs-textcontent///http://d.hatena.ne.jp/cou929_la/20110517/1305644081getPlainText = function (node) {// used for testing: // return node. innertext | node. textcontent; var normalize = function (a) {// clean up double line breaks and spacesif (! A) Return ""; return. replace (/+/g ,""). replace (/[\ t] +/GM ,""). replace (/[] + $/GM ,""). replace (/^ [] +/GM ,""). replace (/\ n +/g, "\ n "). replace (/\ n + $ /,""). replace (/^ \ n + /,""). replace (/\ nnewline \ n/g, "\ n "). replace (/newline \ n/g, "\ n"); // ie} var removewhitespace = function (node) {// getting rid of empty text nodesvar iswhite = function (node) {return! (/[^ \ T \ n \ r]/. test (node. nodevalue);} var Ws = []; var findwhite = function (node) {for (VAR I = 0; I <node. childnodes. length; I ++) {var n = node. childnodes [I]; If (N. nodetype = 3 & iswhite (N) {ws. push (n)} else if (N. haschildnodes () {findwhite (n) ;}} findwhite (node); For (VAR I = 0; I <ws. length; I ++) {ws [I]. parentnode. removechild (WS [I])} var sty = function (n, Prop) {// get the style of the node. // assumptions are made h Ere Based on tagname. if (N. style [prop]) return n. style [prop]; var S = n. currentstyle | n. ownerdocument. defaultview. getcomputedstyle (n, null); If (N. tagname = "script") Return "NONE"; if (! S [prop]) Return "Li, P, TR". indexof (N. tagname)>-1? "Block": N. style [prop]; If (s [prop] = "Block" & N. tagname = "TD") Return "feaux-inline"; return s [prop];} var blocktypenodes = "table-row, block, list-item "; vaR isblock = function (n) {// diaply: block or something elsevar S = sty (n, "display") | "feaux-inline"; if (blocktypenodes. indexof (s)>-1) return true; return false;} var recurse = function (n) {// loop through all the child nodes // and collect the text, Noting whether // spaces or line breaks are needed. if (/PRE /. test (STY (n, "whitespace") {T + = n. innerhtml. replace (/\ t/g ,""). replace (/\ n/g, ""); // to match iereturn "";} var S = sty (n, "display "); if (S = "NONE") Return ""; var Gap = isblock (n )? "\ N": ""; t + = gap; For (VAR I = 0; I <n. childnodes. length; I ++) {var c = n. childnodes [I]; If (C. nodetype = 3) T + = C. nodevalue; If (C. childnodes. length) recurse (c);} t + = gap; return t;} // use a copy because stuff gets changednode = node. clonenode (true); // line breaks aren't picked up by textcontentnode. innerhtml = node. innerhtml. replace (/<br>/g, "\ n"); // double line breaks after P tags are desired, but wou Ld get // stripped by the final Regexp. using placeholder text. vaR paras = node. getelementsbytagname ("p"); For (VAR I = 0; I <paras. length; I ++) {paras [I]. innerhtml + = "newline";} var T = ""; removewhitespace (node); // make the call! Return normalize (recurse (node ));}

However, for the parent element with multi-layer nesting relationships, how to perform complex operations is undoubtedly thankless, so many frameworks ignore this!

The following are the operation functions of the element text of my framework.

 
// By situ zhengmei text: function (value) {var node = This [0]; If (value = void 0) {If (! Node) {return ""} else if (node. tagname = "option" | node. tagname = "script") {return node. text;} else {return node. textcontent | node. innertext | Dom. gettext ([node]) ;}} else {return this. empty (). append (node & node. ownerdocument | DOC ). createtextnode (value ));}},