jquery - Read all text between non-sibling HTML tags -


i have html page (created drupal) that, near top of page @ place of choosing, has

<span class="marker-start"></span> 

and near end, @ place of choosing, has

<span class="marker-end"></span> 

in between html written users not formed.

the user can add additional tags above, exclude content, eg:

<span class="marker-end"></span> <div>this html here excluded</div> <span class="marker-start"></span> 

note exclusion block begins 'marker-end', matches 'marker-start' @ beginning of page form pair, , exclusion block ends 'marker-start' pair 'marker-end' @ end of document (or start of exclusion block).

while theoretically exclusion block formed, again: written users. tags may legitimately opened or closed in uneven way (for example, /div may after marker-start), , on. basically, there no guarantee markers siblings.

the user can add multiple excluded spans within document.

i need way read text (not html) between each pair of 'marker-start' , 'marker-end', , text (which exclude exclusion blocks) concatenated together. markers may not (in fact not) siblings in balanced position, ie there tags opened not closed, or vice versa, between them.

i have tried methods suggested in how select content between 2 tags in jquery , get text between 2 elements jquery , hit problems on of them.

in general, have struggled have jquery produce useful results.

can suggest simplest method achieve this? have 2 solutions outline in answer others see neither perfect.

you try walking entire dom, recursively, , exclude elements based on prior start , end markers found:

as simple example (if understand exclusion logic correctly):

jsfiddle: http://jsfiddle.net/fdductdg/2/

function walkdom(node, func) {     func(node);     node = node.firstchild;     while (node) {         walkdom(node, func);         node = node.nextsibling;     } };  var inmarker = false;  walkdom(document.body, function (node) {     var $node = $(node);     if ($node.is('span')) {         if ($node.hasclass('marker-end')) {             inmarker = false;             console.log("end marker");         } else if ($node.hasclass("marker-start")) {             inmarker = true;             console.log("start marker");         }     }     if (node.nodetype == 3)     {         if (!inmarker)         {             // not inside marker, remove text content             node.textcontent = "";         }     } }); 

update:

as wish retain original text, can either collect in variable (as appear have done in comment) or wrap matching text nodes in appropriate elements (e.g. span appropriate class) excluded text can styled-in/out, without destroying content.


Comments

Popular posts from this blog

javascript - Jquery show_hide, what to add in order to make the page scroll to the bottom of the hidden field once button is clicked -

javascript - Highcharts multi-color line -

javascript - Enter key does not work in search box -