JS:如何在appendChild()中连接变量?

时间:2015-01-09 14:37:13

标签: javascript

我正在尝试将一个文本节点附加到一个段落中,其值来自其父函数的参数。

function writeText(id, value, text) {

    //create our html elements

    var body = document.body;
    var par = document.createElement("p");
        par.className = id;
    this.value = document.createTextNode(value);
    this.text = document.createTextNode(text);

    //instantiate array that we will push value and text into

    textToInsert = [];
    textToInsert.push(this.value, this.text);

    //appends this.text and this.value inside the paragraph
    //and then appends that paragraph element into the body

    par.appendChild(textToInsert.join(' :'); //this does not work!
    par.appendChild(this.value+this.text); //this does not work!
    par.appendChild(this.value); //this works!
    body.appendChild(par);       
}

此代码给出了错误消息

Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'.

所以我认为join()不生成节点。如何在一个appendChild()内连接两个变量?

1 个答案:

答案 0 :(得分:2)

join总是生成字符串。数组中的文本节点将被字符串化。

相反,您需要在数组中放置普通字符串,并且只创建一个可以附加的文本节点,并使用所需的连接内容。

var stringsToInsert = [value, text],
    stringToInsert = stringsToInsert.join(' :');

var textNode = document.createTextNode(stringToInsert);
par.appendChild(textNode);