js增加网页控件

Question

js函数代码如下：
function add(){
var num;
var string;
num = $('#hidenumber').val();
num = parseInt(num)+1;
$('#hidenumber').val(num);
string='这里是一行html代码';
$('#titleconn').append(string);
}
页面部分代码如下：
<input name="hidenum" type="hidden" value="3" id="hidenumber"/>
<span id="titleconn">
<tr id="td11" align="center"><td width="5%">序号</td><td width="15%">作者</td><td width="30%">论文名称</td><td width="8%">期刊类别(代码)</td><td width="20%">刊物名称</td><td width="10%">发表时间</td><td width="12%">备注</td></tr>*************
这里是相同的一行html代码
*************</tr>
</span>
<tr id="td11"><td></td><td align="center"><a onClick="add()" href="#">+增加一栏+</a></td>
<td colspan="5"></td>
</tr>
如上，点击增加一栏，会在span中增加一行html控件，在IE中是没有问题的，但是在ff和google浏览器下面，发现增加出来的那个控件跑到了页面的最上方，而不是span区域里头，困惑中

Answer 1

你也页面代码有问题，别用<span>包括<tr>标签

Answer 2

<table id="titleconn"> 
<tr id="td11" align="center"> <td width="5%">序号 </td> <td width="15%">作者 </td> <td width="30%">论文名称 </td> <td width="8%">期刊类别(代码) </td> <td width="20%">刊物名称 </td> <td width="10%">发表时间 </td> <td width="12%">备注 </td> </tr> ************* 
这里是相同的一行html代码 
************* </tr> 
</table>
这样就OK了

Answer 3

<span>不是块级元素,是行内元素不应该在里面有表格的行tr,可以有表格的项td

Answer 4

<span> 套 <tr>不符合规范
<script src="js/jquery-1.3.2.js" type="text/javascript"> </script> 
<script type="text/javascript"> 
function add(){ 
var num; 
var string; 
num = $('#hidenumber').val(); 
num = parseInt(num)+1; 
$('#hidenumber').val(num); 
string="<tr><td>x</td><td>x</td><td>x</td><td>x</td><td>x</td><td>x</td><td>x</td></tr>"; 
$('#tdn').before(string); 
} 
</script>
<input name="hidenum" type="hidden" value="3" id="hidenumber"/> 
<table id="titleconn"> 
<tr id="td11" align="center">
<td width="5%">序号 </td> <td width="15%">作者 </td> <td width="30%">论文名称 </td> <td width="8%">期刊类别(代码) </td> <td width="20%">刊物名称 </td> <td width="10%">发表时间 </td> <td width="12%">备注 </td> </tr> 
</tr>
<tr id="tdn"> <td> </td> <td align="center"> <a onClick="add()" href="#">+增加一栏+ </a> </td> 
<td colspan="5"> </td> 
</tr> 
</table>