2014-07-08 79 views
0

我動態地創建一個表。我想添加一個文本到一個單元格中。點擊文字後,它會發出警報。javascript:如何插入對象到innerHtml?

我不知道我的代碼有什麼問題。它看起來不起作用。

我的代碼如下:

<html> 
<head> 
<script language="javascript" type="text/javascript"> 
function alertInfo(){ 
alert("info"); 
} 
function insRow() 
    { 
    var p ="<p><u><font size="2" color="blue" onclick='alertInfo()' style="cursor:pointer">parragraph</font></u></p>"; 
//var p=""; 
    var x=document.getElementById('myTable').insertRow(0); 
    var y=x.insertCell(0); 
    var z=x.insertCell(1); 
    y.appendChild(p); 
    z.innerHTML="NEW CELL2" 
    } 
</script> 
<style type="text/css"> 
p{ 
a:link{color:#FFFFFF;} 
a:visited{color:#FFFFFF;} 
a:hover{color:#FFFF00;} 
a:active{color:#00CC00;} 
} 
</style> 

</head> 

<body> 
<table id="myTable" border="1"> 
<tr> 
<td>Row1 cell1</td> 
<td>Row1 cell2</td> 
</tr> 
<tr> 
<td>Row2 cell1</td> 
<td>Row2 cell2</td> 
</tr> 
<tr> 
<td>Row3 cell1</td> 
<td>Row3 cell2</td> 
</tr> 
</table> 
<br /> 
<input type="button" onclick="insRow()" value="insertRow"> 

</body> 
</html> 
+0

是不是在Javascript控制檯中出現語法錯誤?他們沒有幫助你找出問題所在? – Barmar

回答

2

它看起來像你需要逃離這個字符串中的引號:

var p ="<p><u><font size="2" color="blue" onclick='alertInfo()' style="cursor:pointer">parragraph</font></u></p>"; 

它改成這樣:

var p ="<p><u><font size=\"2\" color=\"blue\" onclick='alertInfo()' style=\"cursor:pointer\">parragraph</font></u></p>"; 
+0

或將它們更改爲單引號,就像他爲'onclick'所做的那樣。 – Barmar

1

P是有語法錯誤

使用innerHTML而不是appendChild

function insRow() { 
      var p = "<p><u><font size='2' color='blue' onclick='alertInfo()' style='cursor:pointer'>parragraph</font></u></p>"; 
      //var p=""; 
      var x = document.getElementById('myTable').insertRow(0); 
      var y = x.insertCell(0); 
      var z = x.insertCell(1); 
      y.innerHTML = p; 
      z.innerHTML = "NEW CELL2" 
     } 
相關問題