2013-04-07 49 views
1

下面是我正在玩的HTML代码。它所做的只是创建一个带有两个按钮的元素:“Element1”(TitleButton)和“Add”。通过点击“添加”,元素被克隆并分配id =“元素2”。我无法做的是为克隆元素的TitleButton赋值“Element2”。我该怎么做,最好在addNode()函数内?如果这是不可能的,那么其他方法是什么?谢谢引用和更改容器内HTML按钮的属性

<HTML> 
<HEAD> 
<TITLE>Dynamically add Textbox, Radio, Button in html Form using JavaScript</TITLE> 
<SCRIPT language="javascript"> 

    function addNode(element) { 

    var adding_element = element.parentNode;   
    var added_element=adding_element.cloneNode(true); 
    added_element.setAttribute("id","element 2"); 

    var cont = adding_element.parentNode; 
    cont.appendChild(added_element); 
    } 

</SCRIPT> 
</HEAD> 

<BODY> 
<FORM> 
    <div name="container" id="container"> 
    <div name="element 1" id="element 1"> 
     <input type="button" value= "element1"; name="TitleButton" /> 
     <input type="button" value="Add" name="add[]" onclick="addNode(this)" /> 
    </div> 
    </div> 
</FORM> 
</BODY> 
</HTML> 

回答

1

您可以使用firstElementChild属性。

var id = 2; 
function addNode(element) { 
    var adding_element = element.parentNode; 
    var added_element = adding_element.cloneNode(true); 
    added_element.setAttribute("id", "element" + id); 
    added_element.firstElementChild.setAttribute('value', 'element ' + id); 

    var cont = adding_element.parentNode; 
    cont.appendChild(added_element); 
    id++; 
} 

http://jsfiddle.net/SUkYg/1/