Javascript 用Ajax响应替换DOM节点

我有一个ajax响应，如下所示：

<div class = "element3"> some other text</div>

其他一些文本

我想用resp替换下面的element1：

<div class = "a">
  <div class = "element1"></div>
  <div class = "element2"></div>
</div>

因此，在更换之后，我会得到：

<div class = "a">
  <div class = "element3"> some other text</div>
  <div class = "element2"></div>
</div>

其他一些文本

我尝试了replaceChild（），但它不起作用，因为响应不是DOM对象

---

谢谢

如果只想替换文本，请在目标元素上设置

innerText

属性。如果要插入所有HTML，请在目标元素上设置

innerHTML

属性。要替换目标元素本身，我相信您可以使用

outerHTML

与

innerHTML（）

只替换标记之间的内容不同，

outerHTML（）

还允许您替换开始和结束标记，有效地替换DOM节点

var element = document.getElementsByClassName('element1')[0];
element.outerHTML("<div class = 'element3'> some other text</div>");

var element=document.getElementsByClassName（'element1'）[0]；
element.outerHTML（“其他一些文本”）；

见：

• 
  
• 
  
  

注意：由于使用了

getElementsByClassName（）

，此解决方案对（请参阅：）有效：

• Internet Explorer 9+
  
• Firefox 3+
  
• Opera 9.5+
  
• 铬4+
  
• Safari 3.1+
  

下面是一个用另一个DOMELENT替换DOMELENT的示例

<div class = "a">
<div class="element1">--</div>
  <div class="element2">--</div>
</div>

<div class="element3"> some other text</div>

var element = document.getElementsByClassName('element1')[0];
var replacement = document.getElementsByClassName('element3')[0];
element.parentNode.replaceChild(replacement, element);

--
--
其他一些文本
var元素=document.getElementsByCassName（'element1'）[0]；
var replacement=document.getElementsByClassName（'element3'）[0]；
元素.parentNode.replaceChild（替换，元素）；

我建议，虽然您已经有了答案，但我建议您：

var newContent = '<div class = "element3"> some other text</div>',
    temp = document.createElement('div'),
    div1 = document.getElementsByClassName('element1')[0];

temp.innerHTML = newContent;

div1.parentNode.replaceChild(temp.firstChild, div1);​

参考资料：

---

基本上我想删除element1并添加element3，“a”上的innerHTML也将删除element2，element1上的innerHTML将生成其他一些文本@TrottIf使用jquery，使用

replacetwith

function findByClassName(classname, el) {
    if (!classname) {
        return false;
    }
    else {
        el = !el ? document.getElementsByTagName('body')[0] : el;
        var children = el.getElementsByTagName('*'),
            withClass = [];

        for (var i = 0, len = children.length; i < len; i++) {
            if (children[i].nodeType == 1) {
                var classes = children[i].className.split(/\s+/);
                for (var c = 0, leng = classes.length; c < leng; c++) {
                    if (classes[c] == classname) {
                        withClass.push(children[i]);
                    }
                }
            }
        }

        return withClass;
    }
}

var newContent = '<div class = "element3"> some other text</div>',
    temp = document.createElement('div'),
    div1 = document.getElementsByClassName ? document.getElementsByClassName('element1')[0] : findByClassName('element1')[0];

temp.innerHTML = newContent;

div1.parentNode.replaceChild(temp.firstChild, div1);​