在js中使用innerHTML以外的其他方法

using other method than innerHTML in js?

本文关键字：其他 方法 innerHTML js      更新时间：2023-09-26
<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;
}

你好，小伙子们！我想知道：1-是否有另一种方法可以获取html文本，而不是使用innerHtml-方法？对于那些在Jquery工作的人来说，在Jquery中实现这段代码会更容易吗？最怕排队，也许更快？谢谢！：(

如果您可以使用jQuery，就可以使它变得简单。您使用的事件是什么？

您可以使用jQueryhtml((方法来获取/设置innerHTML。

获取innerHTML

$(obj).html()

设置：

$(textArea).value(targetInnerHtml)

似乎你只想要文本，所以你可以写：

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

一个更健壮的版本是：

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

它可以变成一个函数，这样你就可以调用它，而不必每次都写上面的内容。

其他评论：

function catchIt(e) {
editing = false;
  if (editing) {

编辑将如何实现？

  parentnode.insertBefore(butt, obj);

butt未在任何地方声明或初始化。

相关文章：