Dom Nodes manipulations, how remove tags which wrap my selection?

Posted by sanceray3 on Stack Overflow See other posts from Stack Overflow or by sanceray3
Published on 2010-03-18T14:32:35Z Indexed on 2010/03/18 14:41 UTC
Read the original article Hit count: 198

Filed under:
|
|

Hi,

I try to explain you my "problem". I would like to know when I select a part of text, if this text is “wrapped” by html tags, and in function delete them.

For example with this sentence :

The car is <strong>green</strong>, and the boat is black

If I select “green” and click on a button, I would like verify if green is wrapped by <strong>(for that it’s ok), and in function delete <strong> tags without delete containing “green”.

I have tried to do it, but when I remove child and recreate one, my new node is empty and if I try to put directly text in document.createTextNode, my new node appears but the <strong> tags stay.

// Bouton CLICK
    $('input[type=button].btn_transform').click(function(){

var selObj = window.getSelection();    
        var parent=selObj.anchorNode.parentNode;

        if (parent.nodeName=='STRONG'){       
           parent.removeChild(selObj.anchorNode);
            var theText = document.createTextNode(selObj);
            parent.appendChild(theText);             
        }
    });

I’m not a DOM manipulation specialist. Could you help me to solve this?

Thanks very much for your precious help.

© Stack Overflow or respective owner

Related posts about dom

Related posts about textnode