2011-12-24 1 views
1

Допустим, что это в HTML код:Добавить другой элемент, используя GetElementById?

<tr> 
    <td>Wusool</td> 
    <td id="yasel"> 
     15:12 
    </td> 
</tr> 

, и я хочу, чтобы изменить его в этот HTML код:

<tr> 
    <td>Wusool</td> 
    <td id="yasel"> 
     15:12 
    </td> 
</tr> 
<tr> 
    <td>Ersal</td> 
    <td id="sent"> 
     20:12 
    </td> 
</tr> 

Как я могу использовать GetElementById, чтобы сделать это?

Заранее спасибо.

ответ

0

После получения elementbyID получить родительский элемент (у меня нет кода, но вы можете google как получить родительский элемент для html getelementbyID). Затем добавьте дочерний элемент.

+0

Там же атрибут 'parentNode':.' Document.getElementById («ID») parentNode';) – ComFreek

1
var tr = document.getElementById('yasel').parentNode, 
    new_tr = tr.parentNode.insertRow(tr.rowIndex + 1), 
    new_td; 

new_tr.insertCell(0).innerHTML = 'Erasel'; 

(new_td = new_tr.insertCell(1)).innerHTML = '20:12'; 
new_td.id = "sent"; 

http://jsfiddle.net/7N3kr/

0

Попробуйте этот код в голове HTML:

<script language="javascript" type="text/javascript" > 
    function ChangeValue(element_id, val) { 
     var elm = document.getElementById(element_id); 
     elm.innerHTML = val; 
    } 
</script> 

Try Это в HTML теле:

<table> 
    <tr> 
     <td> 
      <span id="box1"></span> 
     </td> 
     <td> 
      <span id="box2"></span> 
     </td> 
     <td> 
      <span id="box3"></span> 
     </td> 
    </tr> 
</table> 
<input type="button" id="btn_change1" value="Change Value" onclick="ChangeValue('box1','22:30')" /> 
<input type="button" id="btn_change2" value="Change Value" onclick="ChangeValue('box2','11:10')" /> 
<input type="button" id="btn_change3" value="Change Value" onclick="ChangeValue('box3','21:35')" /> 
+2

ли вы опубликовать свой ответ под правым вопрос? Похоже, вы отвечаете на совершенно другой вопрос. –

0

Использование JavaScript вы можете сделать это, как

var td_elem = document.getElementById('yasel'); 
var tr_elem = td_elem.parentNode; 
var table_elem = tr_elem.parentNode; 

table_elem.innerHTML = table_elem.innerHTML + '<tr><td>Ersal</td><td id="sent">20:12</td></tr>'; 

скрипку: http://jsfiddle.net/4MJuS/

но вы должны попробовать использовать JQuery, это очень хорошая основа для JavaScript. вы можете сделать это легко с помощью варьироваться в JQuery

$('#yasel').parent().parent().append('<tr><td>Ersal</td><td id="sent"> 20:12 </td></tr>'); 
+1

Вы действительно не должны делать такие вещи, как 'table_elem.innerHTML = table_elem.innerHTML + ' ...''. Это ужасно разрушительно, для этого требуется гораздо больше накладных расходов, чем необходимо. –