向表中添加一行以使用JavaScript显示标题_Javascript_Jquery_Html

向表中添加一行以使用JavaScript显示标题

javascript jquery html

向表中添加一行以使用JavaScript显示标题,javascript,jquery,html,Javascript,Jquery,Html,我正在尝试向表中添加一行，并仅使用JavaScript显示文本。我尝试了下面的代码来尝试下面的布局 var abcArray=[“800000”、“A36386”、“FFD4D8”、“223CFF”、“F5FF5A”， “#FF5555”、“#A7EBFF”]； var table=document.getElementById（“titleTxt”）； var tr=document.createElement（“tr”）； var td=document.createElement（“t

我正在尝试向表中添加一行，并仅使用JavaScript显示文本。我尝试了下面的代码来尝试下面的布局

var abcArray=[“800000”、“A36386”、“FFD4D8”、“223CFF”、“F5FF5A”，
“#FF5555”、“#A7EBFF”]；
var table=document.getElementById（“titleTxt”）；
var tr=document.createElement（“tr”）；
var td=document.createElement（“td”）；
var txt=document.createTextNode（“某个值”）；
td.appendChild（txt）；
tr.appendChild（td）；
表1.儿童（tr）
body{字体大小：30px；
字体系列：“Arial”、“无衬线”；}
桌子{
边缘顶部：50px；
背景色：白色；
边框：1px纯黑；
左边距：自动；
右边距：自动；
宽度：50%
}
运输署{
宽度：700px；
填充物：5px；
边框：1px纯黑；
}
.西班牙人1，
.西班牙2{
文本对齐：居中；
}  
.西班牙人1{
宽度：400px；
}
.西班牙2{
宽度：600px；
}
span2rows先生{
文本对齐：左对齐；
}
.squareDivs{
宽度：100px；
高度：100px；
背景色：#000000；
利润率：10px；
边界半径：10px；
显示：内联块；
}
.squareTxt{
线高：100px；
垂直对齐：中间对齐；
}
.alignTxt{text align:center；}
因为没有声明EventListener，所以应该将JS放在HTML下面
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"         "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Lab Report</title>
<script src="jquery.js"></script>

</head>

<body> 

<div class="alignTxt"><span id="titleTxt"></span></div>

<table>
<tr>
 <td class='spanrows2'>
    <div class='squareDivs'><span class='squareTxt'></span></div>
    <div class='squareDivs'><span class='squareTxt'></span></div>
    <div class='squareDivs'><span class='squareTxt'></span></div>
    <div class='squareDivs'><span class='squareTxt'></span></div>
    <div class='squareDivs'><span class='squareTxt'></span></div>
    <div class='squareDivs'><span class='squareTxt'></span></div>
    <div class='squareDivs'><span class='squareTxt'></span></div>
    <div class='squareDivs'><span class='squareTxt'></span></div>
    <div class='squareDivs'><span class='squareTxt'></span></div>
</td>
</tr>
</table>
**<script src="myScript.js"></script>**
</body>
</html>


实验室报告
****

附言：删除了你的css。在这个问题/示例中没有必要这样做。
请确保您的javascript进入了
标记中，方法是将它放在自己的文件中，如“myScript.js”（根据您的示例），或者将代码放在自己的标记中，如图所示。这通常会出现在
部分：
<script>
/*!
Your jQuery and javascript codes here
*/

function run() {
    var abcArray = ["#800000","#A36386", "#FFD4D8", "#223CFF", "#F5FF5A", 
    "#FF5555", "#A7EBFF"];

    var table = document.getElementById("titleTxt");

    var tr = document.createElement("tr");
    var td = document.createElement("td");
    var txt = document.createTextNode("some value");

    td.appendChild(txt);
    tr.appendChild(td);
    table.appendChild(tr);
}

window.addEventListener("load", run, false);
</script>


/*!
这里是jQuery和javascript代码
*/
函数运行（）{
var abcArray=[“800000”、“A36386”、“FFD4D8”、“223CFF”、“F5FF5A”，
“#FF5555”、“#A7EBFF”]；
var table=document.getElementById（“titleTxt”）；
var tr=document.createElement（“tr”）；
var td=document.createElement（“td”）；
var txt=document.createTextNode（“某个值”）；
td.appendChild（txt）；
tr.appendChild（td）；
表1.儿童（tr）；
}
addEventListener（“加载”，运行，错误）；

此外，您还需要在加载后运行脚本，否则当脚本运行以将新元素添加到时，页面上的元素将不可用
在上面的示例中，添加了一个函数来更新表，该函数被添加到页面加载后要运行的内容中
谢谢你的建议和帮助。但是，表格行不会按照作业要求的方式显示。该行需要附着在当前表的上方，并具有相同的边框和宽度。在行中，文本将显示在左侧“问题编号1:1”。我该如何修改上述代码？对不起，问题似乎已改为“为我做家庭作业”。您似乎已将原来的问题改为比以前更不实用的问题。我认为要让它做你想做的事情，你必须尝试至少了解HTML文档的基本部分是如何构造的
，
，
，以及你需要在哪里放置
和
标记，或者，如何使用
和
包含外部脚本和样式标记。