<html>
<head>
<title>JS测试</title>
<script type="text/javascript">
var num = 2;
function addRow(){
var tr = document.createElement("tr");
var td = document.createElement("td");
var te = document.createTextNode('row '+num++);
td.appendChild(te);
tr.appendChild(td);
var table = document.getElementById("table");
if(tbody.rows.length == 6){
alert('不能加了!');
}else{
table.appendChild(tr);
}
}
</script>
</head>
<body">
<table id="table">
<tr id="n">
<th>行数</th>
</tr>
<tr>
<td>row 1</td>
</tr>
</table>
<input type="button" value="Button" onclick="addRow();">
</body>
</html>
上面JS代码不能向<table>中添加行,因为IE中<table>标签不支持appendChild()方法.
解决办法:在<table>标签中加入<tbody>标签,使用tbody元素加入新行.
<html>
<head>
<title>JS测试</title>
<script type="text/javascript">
var num = 2;
function addRow(){
var tr = document.createElement("tr");
var td = document.createElement("td");
var te = document.createTextNode('row '+num++);
td.appendChild(te);
tr.appendChild(td);
var tbody= document.getElementById("tbody");
if(tbody.rows.length == 6){
alert('不能加了!');
}else{
tbody.appendChild(tr);
}
}
</script>
</head>
<body">
<table>
<tbody id="tbody">
<tr id="n">
<th>行数</th>
</tr>
<tr>
<td>row 1</td>
</tr>
</tbody>
</table>
<input type="button" value="Button" onclick="addRow();">
</body>
</html>
分享到：
相关推荐
- 动态创建表格结构：使用`document.createElement()`函数创建`<tr>`、`<td>`等元素，并通过`.appendChild()`方法将它们添加到正确的父元素中。 - 使用jQuery的`$(element).html()`：在IE8中，有时直接用字符串...
在IE浏览器中，可以直接使用`<input type="radio">`标签。 ```javascript if (document.uniqueID) { // Internet Explorer var radioButton = document.createElement('<input type="radio" name="radioButton" ...
在IE6到IE9这四个版本的Internet Explorer浏览器中，存在一个与DOM操作相关的兼容性问题，即不能直接通过`innerHTML`属性来设置`<tbody>`元素的内容。这个问题主要是由于这些旧版本的IE浏览器对HTML标准的支持不完整...
<button type="button" onclick="getXlsFromTbl('tableExcel','myDiv')">IE导出Excel方法</button> <button type="button" onclick="method5('tableExcel')">Chrome导出Excel</button> </div> <div id="myDiv"> ...
- 解决方案：在`<table>`元素下添加`<tbody>`元素，然后将`<tr>`元素添加到`<tbody>`中。 4. **IE浏览器中的事件绑定问题**： - 解决方案：使用匿名函数绑定事件，例如`addButton.onclick = function() { ...
3. **特定容器限制**：`<tbody>`、`<table>`、`<tr>`等标签在innerHTML操作时，对于它们内部的内容也有严格的限制。直接修改这些元素的innerHTML，特别是插入非标准或不完整的HTML结构，可能引发错误。 解决这个...
首先，我们需要理解HTML表格的基本结构，包括`<table>`, `<thead>`, `<tbody>`, `<tr>`, `<th>`和`<td>`等标签。`<th>`标签用于创建表头，是我们实现点击排序的关键元素。 在JavaScript中，我们可以监听`<th>`元素...
HTML表格由`<table>`元素开始，通过`<tr>`定义行，`<td>`定义单元格。导出功能主要涉及获取表格数据、构建CSV格式字符串，以及触发浏览器下载。 1. **获取HTML表格数据** 使用JavaScript的DOM操作可以轻松获取HTML...
// 获取所有<a>标签 ``` #### DOM操作示例 Prototype.js提供了多种方法来操作DOM，如添加、修改或删除元素： - **添加元素**： ```javascript var newElement = new Element('div', {id: 'newDiv'}); $('...
var xmlString = "<root><item>数据</item></root>"; var xmlDoc = parser.parseFromString(xmlString, "text/xml"); ``` 3. **处理解析结果**：解析后的XML文档将是一个`Document`对象，你可以通过遍历其节点来...
作者指出，在IE浏览器中，`class`属性应该使用`className`来设置，因为`setAttribute("class", value)`在IE中不被支持。这是一个常见的兼容性问题，作者通过条件判断来解决这个问题，对于非IE浏览器使用`...
<a href="javascript:function()">word</a> 上一网页源 asp: request.servervariables("HTTP_REFERER") javascript: document.referrer 释放内存 CollectGarbage(); 禁止右键 document.oncontextmenu = ...
对于表格，我们可以通过`document.getElementById`、`document.querySelector`或`document.querySelectorAll`等方法获取特定的表格元素，如`<table>`、`<tr>`、`<td>`等。 三、表格元素操作 在JavaScript中，我们...
在HTML中，表格由`<table>`、`<tr>`（行）、`<td>`（单元格）等标签组成。使用JavaScript，我们可以动态创建这些元素并插入到文档中。例如： ```javascript // 创建一个新的表格 var table = document....
回顾一下，IE会把标签内前面的一些空白kill掉，还会把它里面标签统统大写，会显示动态添加的属性，在某些元素中，它还是只读的。这个由IE发明的东西，最后被爆如此多缺陷，真是令人心寒。不过innerHTML还有一地雷，...
本文将详细介绍如何利用JS来获取、增加或删除DOM节点，以及如何对HTML中的`<table>`标签进行操作。此外，还将探讨如何通过JS来处理XML数据，包括加载XML文件及解析其内容。 #### DOM操作基础 DOM是一种用于表示和...
此外，`<link>`标签用于引入外部CSS样式表，这样可以对生成的表格进行美化和布局调整。在示例中，引用了一个名为`style.css`的CSS文件，但具体样式并未给出，这通常会定义表格的样式，如字体、颜色、背景等。 总结...
在示例中，选择了一个`<div>`包裹输入框和列表，并使用`<input>`作为输入框，而列表部分使用`<div>`内嵌`<table>`来实现。HTML代码如下： ```html <div id="bodyDiv" name="bodyDiv" style="position: relative; ...
<title>便民设施系统</title> <meta http-equiv="content-type" content="text/html; charset=gbk"/> <link rel="stylesheet" type="text/css" href="style.css"></link> <script src=...