1.给一个table增加一列:
<table id=”objectClassTab”>
<head>
</head>
<tbody>
</tbody>
</tbody>
</table>
var tab=document.getElementById("objectClassTab");//获得表格
var head = tab.getElementsByTagName("thead")[0];//获取head
var trhead = head.getElementsByTagName("tr")[0];//获取第一行
var headlen=head.getElementsByTagName('th').length;//获取列的总数
var thhead = head.getElementsByTagName("th")[headlen];//表头尾部追加一列
var colsNum=tab.rows.item(0).cells.length; //表格的列数
var num=tab.rows.length;//表格当前的行数
var th = document.createElement("th");//创建列的头不
trhead.insertBefore(th,thhead).innerHTML =“列名字”;
for(vari=1;i<num; i++)
{
tab.rows[i].insertCell(colsNum).innerHTML = "";//每一行尾增加一列
}
给表头增加一列时也可以试下:
trhead.appendChild.innerHTML="<th>"+想要加入的动态值+"</th>";//插入列head;
2.给一个table表增加一行:
var table = document.getElementById("objectClassTab");
var thead = table.getElementsByTagName("thead")[0];
var tbody = "";
if (document.getElementsByTagName("tbody").length != 0) {
tbody = document.getElementsByTagName("tbody")[0];
} else {
tbody = document.createElement("tbody");
table.appendChild(tbody);
}
if(thead!=null){
varlen = thead.getElementsByTagName('th').length;
var tbodyLength = tbody.rows.length;
varnewRow = tbody.insertRow(tbodyLength);
newRow.insertCell(0).innerHTML = "<input type='checkbox' name='checkbox' value = 'checkbox'οnclick='handleTable(this)'>";
for (vari = 1; i < len; i++) {
//newRow.insertCell(i).innerHTML ="<input type='text' name='' value=''>";
newRow.insertCell(i).innerHTML = "";
}
}
3.删除选中行
function deleteRow() {
var tab = document.getElementById('objectClassTab');
for (var i = tab.rows.length - 1; i >= 0; i--) {
if (tab.rows[i].cells[0].getElementsByTagName('input')[0].checked) {
if(tab.rows[i].parentNode.nodeName=="TBODY"){
tab.deleteRow(i);
}
}
}
}
4.全选操作
function checkedAll(object){
/* $('#quanxuan').toggle(function () {
$("input[name='abc']").attr("checked", 'true');
}, function () {
$("input[name='abc']").removeAttr("checked");
}); */
var tab = document.getElementById('objectClassTab');
if(object.checked) {
for (var i = tab.rows.length - 1; i > 0; i--) {
tab.rows[i].cells[0].getElementsByTagName('input')[0].checked = true;
tab.rows[i].cells[0].parentNode.style.background = '#9acfea';
}
}else {
for (var i = tab.rows.length - 1; i > 0; i--) {
tab.rows[i].cells[0].getElementsByTagName('input')[0].checked = false;
tab.rows[i].cells[0].parentNode.style.background = '';
}
}
}
5.增加表头
function addHead(object) {
var table =document.getElementById("objectClassTab");
var thead =document.createElement("thead");
var html ="<th><input type=\"checkbox\"name=\"checkbox\" value=\"checkbox\"οnclick=\"checkedAll(this)\"></th>";
for (vari=0;i<object.length;i++) {
vardata = object[i].value;
//varRexStr = /\<|\>/g ;
varRexStr = /\</g ;
data= data.replace(RexStr,'<');
html+="<th>"+object[i].key+"("+data+")</th>";
}
thead.innerHTML = html;
table.insertBefore(thead,table.children[0]);
}
6.创建js的map类型
var Map = function(){
this._entrys= new Array();
this.put= function(key, value){
if(key == null || key == undefined) {
return;
}
varindex = this._getIndex(key);
if(index == -1) {
varentry = new Object();
entry.key= key;
entry.value= value;
this._entrys[this._entrys.length]= entry;
}else{
this._entrys[index].value= value;
}
};
this._getIndex= function(key){
if(key == null || key == undefined) {
return-1;
}
var_length = this._entrys.length;
for(var i = 0; i < _length; i++) {
varentry = this._entrys[i];
if(entry == null || entry == undefined) {
continue;
}
if(entry.key === key) {//equal
returni;
}
}
return-1;
};
}
7.将单元格转化成文本框,然后再取消文本框
// 将单元格转化成文本框
function changeTotext(obj)
{
var tdValue = obj.innerText;
obj.innerText = "";
if(obj.id=="booleanType"){
var txt = document.createElement("select");
txt.id = "_text_";
var str ="<option>true</option><option>false</option>";
txt.innerHTML = str;
obj.appendChild(txt);
}else{
var txt =document.createElement("input");
txt.type = "text";
txt.value = tdValue;
txt.id = "_text_";
txt.setAttribute("className","text");
obj.appendChild(txt);
txt.select();
}
}
// 取消单元格中的文本框,并将文本框中的值赋给单元格
function cancel(obj)
{
var txtValue =document.getElementById("_text_").value;
obj.innerText = txtValue;
}
// 事件
document.onclick = function()
{
if(event.srcElement.tagName.toLowerCase() == "td"
&&event.srcElement.getElementsByTagName("input").length == 0
&&event.srcElement.parentNode.parentNode.parentNode.id == "objectClassTab"
&&event.srcElement.id != "objectid" && event.srcElement.id !="saveObject") {
changeTotext(event.srcElement);
}
}
document.onmousedown = function() {
if(document.getElementById("_text_")
&&event.srcElement.id != "_text_") {
var obj =document.getElementById("_text_").parentElement;
cancel(obj);
dataDeal(obj);
}
}