“ object HTMLDivElement”与externalHTML并与replaceWith()无关

问题描述 投票:0回答:1

我对失败的原因感到困惑。我正在尝试直接用jquery的replaceWith完全替换DIV。

我已经尝试了很多变化,但是没有任何更新。或者,如果我尝试用externalhtml [object HTMLDivElement]代替html。 (这意味着我确定可以使用节点,对吗?这意味着replaceWith()应该可以工作?)。

我正在遍历当前显示的'cardObjects'数组,并将其与结构相同的传入数组进行比较(这是一个排序的有序列表)。 object.html是节点元素。并且对象的.target指向元素的ID。


function cardConstructor(item)
     {
     var cardDiv = constructElement('div', "queCard", "machine"+item.machineID+"ID"+item.ID, "");
     //more html stuff gets appended to this element, but not relevant for problem
     cardObject = 
            {
            ID: item.ID,
            machineID: item.machineID, 
            lastID: item.lastID, 
            nextID: item.nextID, 
            jobID: item.jobID,
            target: cardDiv.id, //string
            html: cardDiv //node

        }
        return cardObject;

}
// here is where the problem is - 
//it is in an update loop, 
//this is failing

else if(inc[y].ID != current[y].ID)
                    {
                    console.log("ids do not match, splicing and replacing");
                    console.log("current y target is:");
                    console.log(current[y].target); //334 ---console output
                    var updateTarget = document.getElementById(current[y].target);

                    console.log("old html"); //337
                    console.log(updateTarget); //338
                    console.log("new html"); //339
                    console.log(inc[y].html); //340

                    updateTarget.replaceWith(inc[y].html); 
                    console.log("update target updated: as"); //343
                    console.log(updateTarget);   //344
                    current.splice(y,1, inc[y]);

                }

console.log输出是:

current y target is:
machinewindow.php:334 machine1ID775
machinewindow.php:337 old html

machinewindow.php:338 <div class=​"queCard" id=​"machine1ID775">​<div class=​"queCardTitle" id=​"Titlemachine1ID775">​<div class=​"itter" id=​"itterDiv+1machine1ID775">​1​</div>​<button class=​"completeBtn" id=​"complete775" value=​"775">​complete​</button>​</div>​<div class=​"queCardBody" id=​"Bodymachine1ID775">​…​</div>​<div class=​"queCardFooterW" id=​"queCardFooterWmachine1ID775">​…​</div>​</div>​

machinewindow.php:339 new html

machinewindow.php:340 <div class=​"queCard" id=​"machine1ID774">​<div class=​"queCardTitle" id=​"Titlemachine1ID774">​…​</div>​<div class=​"queCardBody" id=​"Bodymachine1ID774">​…​</div>​<div class=​"queCardFooterW" id=​"queCardFooterWmachine1ID774">​…​</div>​</div>​

machinewindow.php:343 update target updated: as

machinewindow.php:344 <div class=​"queCard" id=​"machine1ID775">​<div class=​"queCardTitle" id=​"Titlemachine1ID775">​…​</div>​<div class=​"queCardBody" id=​"Bodymachine1ID775">​…​</div>​<div class=​"queCardFooterW" id=​"queCardFooterWmachine1ID775">​…​</div>​</div>​

这里如console.log中所示,没有更新的div。如果我改为尝试updateTarget.outerHTML = inc [y] .html-然后在浏览器窗口中得到[object HTMLDivElement]。

我已经尝试了几次迭代-但对于为什么它不起作用,我有点迷茫。object.html是一个节点,但不会将其替换为replaceWith();

我可能缺少一些东西。

也是下面是那个request的constructElement函数。


function constructElement(element, styleClass, type, data)
    {
      var ele = document.createElement(element);
        ele.setAttribute("class", styleClass);
        ele.setAttribute("id", type);
        ele.innerHTML = data; 
        return ele;
  }

我对失败的原因感到困惑。我试图直接用jquery的replaceWith完全替换DIV。我试过一堆变化,但要么没有更新。或者,如果我尝试...

javascript arrays dom replacewith outerhtml
1个回答
0
投票

[如果您想使用updateTarget.replaceWith(inc[y].html);将335行替换为:var updateTarget = $(current[y].target);因为replaceWith是jQuery方法,应该应用于jQuery对象。

© www.soinside.com 2019 - 2024. All rights reserved.