0

I have 2 node sets like thus:

var node1 = "<p><img src='src1' /> some text text text <span><img src='img2' /> other text</span><img src='img3' /></p>";
var node2 = "<p><img src='src1' /> some text text text <span>other text</span></p>";

I am trying to find out a way of matching the 2 node sets and removing duplicates from within the P node, so it brings back the resulting node set of.

var result = "<p><span><img src='img2' /></span><img src='img3' /></p>"

Currently I have tried to use jQuerys clone function with:

$(node1).clone().html($(node1).html().replace($(node2).html(), ''))

This returns the original node1 string without removing or replacing any node sets.

I have also attempted a split function converting the html into a string but that got messy real quick, does anyone know any efficient methods for achieving a complex node search/remove duplicates?

John
  • 1,309
  • 2
  • 12
  • 24
  • Loop through all Nodes, custom check depending on node type, e.g. if `.nodeType === 1` put attributes together as `tagName[a1name="a1val"][a2name="a2val"]...` then search this selector and remove all matches (if it doesn't contain children, of course). For text nodes loop over `.nodeType === 3` or see http://stackoverflow.com/questions/298750/how-do-i-select-text-nodes-with-jquery – Paul S. Sep 06 '12 at 10:59
  • Anyone out there able to shed light on this: http://jsfiddle.net/Aa3bk/2/ – John Sep 06 '12 at 12:51
  • Looks like `.find()` isn't working as expected http://jsfiddle.net/Aa3bk/3/ (note: fiddle assumes console.log ), also, `

    ` in `

    ` seperate in the DOM tree ( in chrome anyway ), so I removed one. if you're expecting a `

    ` inside the content, don't use one as the parent element (use a `

    ` or ``)
     – Paul S. Sep 06 '12 at 13:55
  • @shhac it appears to work great on nodes, but it is ignoring the text nodes? – John Sep 06 '12 at 14:37
  • I looped over `children`and not `childNodes` because jQuery doesn't have a way of searching for a `TextNode` and I wanted to keep your basic method. There are also lots of different ways text could "match" (e.g. someone does alone and so the text for "alone" is in a different node to the rest of the sentence but visually no different) – Paul S. Sep 06 '12 at 14:56
  • so you are saying there is no way to check text nodes so I will likely have to write a textNode looper as well? (I am going out now for some hours so unlikely to respond) – John Sep 06 '12 at 15:00
  • You can compare against `.textContent` to see if there is a match but changing `.textContent` will result in node loss so if you want exact node matches, you'll have to loop again. Updated fiddle with basic `TextNode` support http://jsfiddle.net/Aa3bk/4/ Note I've changed your html a bit because malformed html may result in nodes being misplaced and therefore not getting expected results. – Paul S. Sep 06 '12 at 17:17
  • Oh, you may want to loop down (rather than up) too as removing a node reduces `.length` of `.childNodes` on the parent node. – Paul S. Sep 07 '12 at 20:36
  • @shhac i do not understand, what you say is true and perfectly understandable but how are you removing a node without accessing removeChild? could you tweak your example? would that also be why it is not working correctly? by the fact its missing some nodes in your fiddle for example? man this is a complicated question Oo – John Sep 10 '12 at 21:05
  • 1
    http://jsfiddle.net/Aa3bk/5/ changed the loop direction for you, see if that solves it. `elm.parentNode.removeChild(elm);` _is_ a call to `.removeChild` so I don't see what you mean by "without accessing" it. – Paul S. Sep 10 '12 at 22:01

0 Answers0