Question

我道歉，如果已经有答案，我发现没有任何用处。

我正在开发一些JS代码，其中包含一些需要更改其html代码的块。所以我有一个主要对象有两种属性：

使用getHtml（）方法的自定义对象
使用id标签初始化的dom元素应该更改。

我的第一个版本有效：我设置了一些javascript事件和方法，然后我的块内容被更改了。

当然（！）我需要修改代码来实现新功能，现在我的方法返回html代码，但我的变量上的.innerHTML不再起作用了。

让我给你看一些代码并解释一下

var AtelierScreen = function(ancre, dataJson){
    if(!ancre.charAt)               throw "Invalid string-dealer name type ('"+ancre+"') should be String";
    if(ancre.length==0)             throw "Invalid string-dealer name ('"+ancre+"') cannot be empty";

    this.atelierContent;
    this.operationMenu;
    this.operationMenuContent;
    this.operationRecap;
    this.operationRecapContent;

    this.create=function(obj,tagsuffix){
        var tag = ancre+tagsuffix;
        this.atelierContent.innerHTML += "<div id='"+tag+"'></div>";
        var content = document.getElementById(tag);
        if(!content)        throw "Invalid html anchor using '"+tag+"' as an html id";
        content.innerHTML=obj.getHtml();
        return content;
    }

    try{
        var dataObject = JSON.parse(dataJson);
        this.atelierContent = document.getElementById(ancre);
        if(!this.atelierContent)            throw "Invalid html anchor using '"+ancre+"' as an html id";

        // MENU
        this.operationMenu = new OperationMenu(dataObject["dealer"],dataObject["operations"]);
        this.operationMenuContent=this.create(this.operationMenu,"_menu");
        this.operationMenuContent.innerHTML+="after init";

        // RECAP
        this.operationRecap = new OperationRecap();
        this.operationRecapContent=this.create(this.operationRecap,"_recap");
        this.operationMenuContent.innerHTML+="after recap init";

    } catch(error){
        throw "Error decoding json data :\n'"+error+"'\n\nJson =\n'"+dataJson+"'";
    }

    this.setSelectedModel=function(model){
        this.operationMenuContent.innerHTML+="setSelectedModel";
        var isTheSame = this.operationMenu.setSelectedModel(model);
        if(!isTheSame) this.clearOperationItemFromRecap();
        var temp = this.operationMenu.getHtml()
        this.operationMenuContent.innerHTML=temp;
    }
}

快速概述

我的所有属性和帮助初始化它们的方法。
试一试检查json数据。
我使用方法
与程序交互的一些方法

以下是发生的事情

Json正确解析
创建我的第一个块，返回其放在第一个内容属性中的html代码。我将一些文本再次添加到dom作为测试（它可以工作）
创建了我的第二个块，返回其放在第二个内容属性中的html代码。我在第一个内容属性中再次添加一些文本作为测试。它在这一点上失败了。
我的方法没有任何帮助。我的内容属性似乎没有响应。

我仍然可以获取内容属性值 atelierScreen.operationMenuContent.innerHTML; 但是我不能在dom中插入文本。 atelierScreen.operationMenuContent.innerHTML =＆＃34;＆＃34 ;; 什么都不做。

我是否需要使用document.getElement查询dom ...每个时间？我以前使用dom元素作为属性的版本正在运行......

我错过了什么，这太令人沮丧了;）请帮忙。感谢

Answer 1

经过一些研究，可能是因为使用了innerHTML。看起来使用innerHTML会破坏子元素。

我需要先解决这个问题，但我会尝试这样的事情：

使用标记和内容参数创建阻止“抽象”父类，使用标记

prototype getContent（）将如下所示：

if(content==null) content = document.getElementById(this.tag);
return content;

使用我的对象数组初始化我的主“屏幕”对象
循环数组以获取标记并初始化innerHTML
循环数组以实例化对象
getContent将处理其余的事情。

我会给你一些反馈

Answer 2

好的，这就是我做的事情

var AtelierScreen = function(ancre, dataJson){
try{
    var dataObject = JSON.parse(dataJson);
    this.atelierContent = document.getElementById(ancre);
    if(!this.atelierContent)            throw "Invalid html anchor using '"+ancre+"' as an html id";

    var blocks = [
        this.operationMenu   = new OperationMenu(...),
        this.operationRecap  = new OperationRecap(...),
        this.operationResult = new OperationResult(...)
    ];

    for (var i = 0; i < blocks.length; i++) {
        var block=blocks[i];
        this.atelierContent.innerHTML += "<div id='"+block.tag+"'></id>";
    }

    for (var i = 0; i < blocks.length; i++) {
        var block=blocks[i];
        block.getContent().innerHTML = block.getHtml();
    }
} catch(error){
    throw "Error decoding json data :\n'"+error+"'\n\nJson =\n'"+dataJson+"'";
}
}

我在try / catch
我创建了屏幕元素，用于初始化我的锚点
我创建了我的数组块并在同一时间初始化我的对象（我不确定它是否可行，如果稍后会找到这些属性，但确实如此）。 Onjects包含它们的锚点和内容参数。
添加块锚点的第一个循环
创建html内容的第二个循环

我无法将dom元素作为属性存储为dom

2 个答案: