创建一个JS函数来动态地创建HTML元素并将它们嵌套在彼此内部

Question

创建一个JS函数来动态地创建HTML元素并将它们嵌套在彼此内部

3

我创建了下面的函数来动态创建HTML元素并将它们附加到任何我想要的地方。当它运行时，控制台不会记录任何错误，但第二个元素（<p>）不会写入文档。

我认为错误与"createdDiv"变量有关，但我还没有能够确定出错的原因。

非常感谢您的帮助！

//Array of elements to be created

var createdElements = [
    [ 'div', 'Class0', 'ID0'],
    ['p', 'Class1', 'ID1']      
];


//function to create and append elements to document

function createHTML( typeOfCreatedElement ,createdElementClass, createdElementId, locationForCreatedElement ){
    var createdElement = document.createElement( typeOfCreatedElement );
    createdElement.className = createdElementClass;
    createdElement.id = createdElementId;

    locationForCreatedElement['appendChild']( createdElement );

    return createdElement;
}


//run function 2x; 
//createdDiv successfully writes to the document, but createdParagraph disappears into a black hole...

var createdDiv = createHTML( createdElements[0][0], createdElements[0][1], createdElements[0][2], document.body );
var createdParagraph = createHTML( createdElements[1][0], createdElements[1][1], createdElements[1][2], createdDiv );

- Ben Polanco

你能否制作一个 jsfiddle 呢？ :) - www139

实际上，你的代码似乎可以直接使用。要在页面上看到该段落，您需要向其中添加一些内容。 - Teemu

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- gurvinder372 · Accepted Answer

你能尝试使用这个更新后的createHTML方法吗？

function createHTML( typeOfCreatedElement ,createdElementClass, createdElementId, locationForCreatedElement ){
    var createdElement = document.createElement( typeOfCreatedElement );
    createdElement.className = createdElementClass;
    createdElement.id = createdElementId;
    createdElement.innerHTML = "this is a sample text for element type " + typeOfCreatedElement;

    locationForCreatedElement.appendChild( createdElement ); //line that I have changed.

    return createdElement;
}

appendChild 是一个方法，而不是一个属性。