javascript：如何将对象插入innerHtml？

Question

我动态创建一个表。 我想在其中一个单元格中添加文本。 单击文本后，它将发送警报。

我不知道我的代码有什么问题。 看起来不起作用。

我的代码如下：

<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>

Answer 1

看来您需要在此字符串中转义引号：

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>";

Answer 2

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"
        }

javascript：如何将对象插入innerHtml？

问题描述

2 个解决方案

解决方案1
2 已采纳 2014-07-08 16:51:11

解决方案2
1 2014-07-08 17:03:00

javascript：如何将对象插入innerHtml？

问题描述

2 个解决方案

解决方案1 2 已采纳 2014-07-08 16:51:11

解决方案2 1 2014-07-08 17:03:00

解决方案1
2 已采纳 2014-07-08 16:51:11

解决方案2
1 2014-07-08 17:03:00