如何检索元素

Question

这是我想知道的。我有一个表的行数取决于数字在微调器中的数量。这确实有效，例如，如果我在微调器中输入25，则会出现25行，如果我在微调器中输入7，则会有7行。

所以我的问题是这样的：

比方说，有许多在表中的行。我所拥有的是一个textarea，用户在其中输入他们的问题，然后提交问题，问题应该插入并出现在“Question”列下的表的第一行，textarea变为空白，用户进入他的第二个问题，如果用户提交这个，那么问题会出现在第二行，第三个问题到第三行，第四个问题到第四个行等。

问题是，每次我提交一个问题到表中，它创建一个新的行。所以如果我在表格中有20个空行，因为我在微调表达了20个问题，那么每次我提交一个问题时，它会每次添加一个新行，所以从textarea提交20个问题意味着表格会包含20个空白行和20个问题行。我猜这是因为这样的例子：

var enumeratorCell = document.createElement("td"); 

所以我想知道的是如何除外创建创建一个新的行的一个元素，我怎么能检索元素，使得它提交的问题在现有的行从上到下，而不是每次提交问题时都创建一个新行？

Below is my code: 

function insertQuestion() { 
var table = document.getElementById("qandatbl"); 
var tableBody = table.tBodies[0]; 
var textarea = document.getElementById("questionTxt"); 

var row = document.createElement("tr"); 
tableBody.appendChild(row); 

var enumeratorCell = document.createElement("td"); 
enumeratorCell.className = "qid"; 
row.appendChild(enumeratorCell); 

var questionCell = document.createElement("td"); 
questionCell.className = "question"; 
row.appendChild(questionCell); 

var questionText = textarea.value; 
var questionContent = document.createTextNode(questionText); 
questionCell.appendChild(questionContent); 

      } 

HTML：

// table where questions will be inserted into 

    <table> 

    <?php 
    $spinnerCount = $_POST['textQuestion']; 
if($spinnerCount > 0) { 
    for($i = 1; $i <= $spinnerCount; $i++) {?> // this get the number of questions from the spinner 

     <tr> 
      <td class="qid"><?php echo $i; ?></td> 
      <td class="question"></td> 
     </tr> 

    </table> 


//Text Area and submit button to submit questions 

<form id="enter" action="<?php echo htmlentities($_SERVER['PHP_SELF']); ?>" method="post"> 
<table id='middleDetails' border='1'> 
<tr> 
<th class='tblheading' colspan='2'>SESSION DETAILS</th> 
</tr> 
<tr class='trheight'> 
</tr> 
<tr> 
<td id="questionNum">Question No </td> 
</tr> 
<tr> 
<td id="questionContent">Question:</td> 
<td id="questionTextarea"><textarea rows="5" cols="40" id="questionTxt" name="questionText"></textarea></td> 
</tr> 
<tr> 
<td id="addQuestionRow" colspan='2'><input id="addQuestion" type="button" value="Add Question" name="addQuestionBtn" onClick="insertQuestion()" /></td> 
</tr> 
</table> 
</form> 

我想说的是有一个空白表，下表是一个textarea和一个提交按钮，老师提问进入，当老师提出的问题，它会在表中的第一行中，因为这是第一个问题，那么老师重复，第二个问题在第二行等等。但不是将数据插入已经在表中的行中，而是创建新行并将数据插入到新行中。

Answer 1

我想你可能想要做这样的事情：

var table = document.getElementById(tableId); 
var rows = table.getElementsByTagName("tr"); 
for(i = 0; i < rows.length; i++){   
    //manipulate rows 
} 

Answer 2

鉴于现有的表：

<table id="myTable"> 
    <tr> 
     <td>1</td> 
     <td>2</td> 
    </tr> 
    <tr> 
     <td>3</td> 
     <td>4</td> 
    </tr> 
</table> 

如果要检索或更改你可以做现有的单元格的内容这样的：

// get reference to the table 
var t = document.getElementById("myTable"), 
    r, 
    c, 
    i, j; 

// loop through the rows 
for (i=0; i<t.rows.length; i++) { 
    // get reference to current row 
    r = t.rows[i]; // 
    // loop through tds of current row 
    for (j=0; j<r.cells.length; j++) { 
     // get reference to current cell 
     c = r.cells[j]; // equivalent to t.rows[i].cells[j] 
     // display content of cell 
     alert(c.innerHTML); 
     // change content of cell 
     c.innerHTML = "New value " + i + j; 
    } 
} 

如果您知道表的大小提前时间，你可以直接引用特定ŧ d - 提的是，指数从0开始，第三行的第二个TD将是：

var particularTD = t.rows[2].cells[1]; // where t was declared above 
alert(particularTD.innerHTML);