using other method than innerHTML in js?

<div id="content">
    <h1>Redigeringsbara stycken</h1>
    <p class="editable">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>

</div>

//JAVASCRIPT

window.onload = function  () {
    /*
    var pElements = document.getElementsByTagName('*');
    for (var i=0; i < pElements.length; i++) {
        if(pElements[i].className == 'editable')
            inPlaceEditor(pElements[i]);
    };
    */
   document.onclick = catchIt;
};

function inPlaceEditor (editableElement) {

}

var editing = false;

if (document.getElementById && document.createElement)
{
   var butt = document.createElement('BUTTON');
    var buttext = document.createTextNode('Ready!');
    butt.appendChild(buttext);
    butt.onclick = saveEdit;
}

function catchIt(e) {
    if (editing) {
          alert("U're still editing!!");
        return;
    }
    if (!document.getElementById || !document.createElement) return;
    if (!e) var obj = window.event.srcElement;
    else var obj = e.target;
    while (obj.nodeType != 1) {
        obj = obj.parentNode;
        alert(obj.nodeType);
    }
    if (obj.tagName == 'textarea' || obj.tagName == 'a') return;
    while (obj.nodeName != 'P' && obj.nodeName != 'HTML')
    {
        obj = obj.parentNode;
        alert(obj.nodeName);
    }
    if (obj.nodeName == 'HTML') {
        // alert ("this is HTML");
        return;
    }
    //other way to grab the text instead of innerHTML-method????
    var targetInnerHtml = obj.innerHTML;
    var textArea= document.createElement('textarea');
    var parentnode = obj.parentNode;
    parentnode.insertBefore(textArea, obj);
    parentnode.insertBefore("<br />", obj);
    parentnode.insertBefore(butt, obj);
    parentnode.removeChild(obj);
    textArea.value = targetInnerHtml ;
    textArea.focus();
    editing = true;
}

function saveEdit() {
    var area = document.getElementsByTagName('textarea')[0];
    var paragraph = document.createElement('P');
    var parentnode = area.parentNode;
    paragraph.innerHTML = area.value;
    parentnode.insertBefore(paragraph, area);
    parentnode.removeChild(area);
    parentnode.removeChild(document.getElementsByTagName('button')[0]);
    editing = false;
}

HELLO GULRS AND BOYS! Im wondering if: 1- there's another way to grab the html-text instead of using innerHtml- method? for those who work in Jquery would it be easier to 开发者_StackOverflowimplement this code in Jquery? lest lines, faster maybe? gracias! :)

You can make it simple if you can use jQuery. What is the event used by you?

You can use the jQuery html() method to get/set the innerHTML.

To get innerHTML

$(obj).html()

To set it:

$(textArea).value(targetInnerHtml)

It seems that you just want the text, so you can write:

var targetText = obj.textContent || obj.innerText;

A more robust version is:

if (typeof obj.textContent == 'string') {
    targetText = obj.textContent;
} else if (typeof obj.innerText == 'string') {
    targetText = obj.innerText;
}

Which can be turned into a function so you can call it rather than having to write the above each time.

Other comments:

function catchIt(e) {
editing = false;

  if (editing) {

How will editing ever be true?

  parentnode.insertBefore(butt, obj);

butt is not declared or initialised anywhere.