var tr = document.getElementsByTagName("tr"); for (var i = 0; i < tr.length; i++) { bgcChange(tr[i]); }是什么意思?為何這樣使用?能解釋以下代碼問號處的意思么?謝謝
? ?window.onload = function () {
? ? ? ? ? ? var tr = document.getElementsByTagName("tr");//?????????????????
? ? ? ? ? ? for (var i = 0; i < tr.length; i++) { ??//?????????????????
? ? ? ? ? ? ? ? bgcChange(tr[i]); ??//?????????????????
? ? ? ? ? ? }
? ? ? ? ? ? // 鼠標移動改變背景,可以通過給每行綁定鼠標移上事件和鼠標移除事件來改變所在行背景色。
? ? ? ? }
? ? ? ? function bgcChange(obj) { ? ? ? ? //自定義參數及參數名;
? ? ? ? ? ? obj.onmouseover = function () { ? ?//鼠標移到元素上出發事件;
? ? ? ? ? ? ? ? obj.style.backgroundColor = "#f2f2f2"; ?//改變鼠標移到元素時的背景;
? ? ? ? ? ? }
? ? ? ? ? ? obj.onmouseout = function () { ? ?//鼠標離開元素;
? ? ? ? ? ? ? ? obj.style.backgroundColor = "#fff"; ?//鼠標離開元素背景顏色為白;
? ? ? ? ? ? }
? ? ? ? }
? ? ? ? // 編寫一個函數,供添加按鈕調用,動態在表格的最后一行添加子節點;
? ? ? ? var num = 2;//數量 ? 2行表格
? ? ? ? function add() {
? ? ? ? ? ? num++;
? ? ? ? ? ? var tr = document.createElement("tr");//創建一行
? ? ? ? ? ? var xh = document.createElement("td");//創建一單元格
? ? ? ? ? ? var xm = document.createElement("td");//在創建一單元格
? ? ? ? ? ? xh.innerHTML = "xh00" + num;//獲取所創建單元格內容
? ? ? ? ? ? xm.innerHTML = "第" + num + "學生";//獲取所創建單元格內容
? ? ? ? ? ? var del = document.createElement("td");//創建一單元格
? ? ? ? ? ? del.innerHTML = "<a href='javascript:;' onclick='del(this)' >刪除</a>";//獲取所創建單元格內容
? ? ? ? ? ? var tab = document.getElementById("table");//獲取table的id
? ? ? ? ? ? tab.appendChild(tr);//為table添加節點元素“行”appendChild()指定節點的最后子節點添加子節點
? ? ? ? ? ? tr.appendChild(xh);//為 tr 添加子節點“單元格”
? ? ? ? ? ? tr.appendChild(xm);//為 tr 添加子節點“單元格”
? ? ? ? ? ? tr.appendChild(del);//為 tr 添加子節點“單元格”
? ? ? ? ? ? var tr = document.getElementsByTagName("tr");//返回帶有指定標簽的集合;
? ? ? ? ? ? for (var i = 0; i < tr.length; i++) {
? ? ? ? ? ? ? ? bgcChange(tr[i]); ?//?????????????????
? ? ? ? ? ? }
? ? ? ? }
? ? ? ? // 創建刪除函數
? ? ? ? function del(obj) {
? ? ? ? ? ? var tr = obj.parentNode.parentNode; ?//?????????????????
? ? ? ? ? ? tr.parentNode.removeChild(tr); ?//?????????????????
? ? ? ? }
2016-04-29
??window.onload = function () {
? ? ? ? ? ? var tr = document.getElementsByTagName("tr");//獲取標簽名為tr的標簽的集合
? ? ? ? ? ? for (var i = 0; i < tr.length; i++) { ??//循環tr.length-1次,tr.length-1是獲取到的tr標簽的個數
? ? ? ? ? ? ? ? bgcChange(tr[i]); ??//對tr標簽執行函數bgcChange,tr[i]作為參數,比如循環第一次,i=0,tr[0]就是第一個tr標簽,第一個標簽作為參數傳入bgcChange函數
? ? ? ? ? ? }
? ? ? ? ? ? // 鼠標移動改變背景,可以通過給每行綁定鼠標移上事件和鼠標移除事件來改變所在行背景色。
? ? ? ? }
? ? ? ? function bgcChange(obj) { ? ? ? ??//自定義參數及參數名;
? ? ? ? ? ? obj.onmouseover = function () { ? ?//鼠標移到元素上出發事件;
? ? ? ? ? ? ? ? obj.style.backgroundColor = "#f2f2f2"; ?//改變鼠標移到元素時的背景;
? ? ? ? ? ? }
? ? ? ? ? ? obj.onmouseout = function () { ? ?//鼠標離開元素;
? ? ? ? ? ? ? ? obj.style.backgroundColor = "#fff"; ?//鼠標離開元素背景顏色為白;
? ? ? ? ? ? }
? ? ? ? }
? ? ? ? // 編寫一個函數,供添加按鈕調用,動態在表格的最后一行添加子節點;
? ? ? ? var num = 2;//數量 ? 2行表格
? ? ? ? function add() {
? ? ? ? ? ? num++;
? ? ? ? ? ? var tr = document.createElement("tr");//創建一行
? ? ? ? ? ? var xh = document.createElement("td");//創建一單元格
? ? ? ? ? ? var xm = document.createElement("td");//在創建一單元格
? ? ? ? ? ? xh.innerHTML = "xh00" + num;//獲取所創建單元格內容
? ? ? ? ? ? xm.innerHTML = "第" + num + "學生";//獲取所創建單元格內容
? ? ? ? ? ? var del = document.createElement("td");//創建一單元格
? ? ? ? ? ? del.innerHTML = "<a href='javascript:;' onclick='del(this)' >刪除</a>";//獲取所創建單元格內容
? ? ? ? ? ? var tab = document.getElementById("table");//獲取table的id
? ? ? ? ? ? tab.appendChild(tr);//為table添加節點元素“行”appendChild()指定節點的最后子節點添加子節點
? ? ? ? ? ? tr.appendChild(xh);//為 tr 添加子節點“單元格”
? ? ? ? ? ? tr.appendChild(xm);//為 tr 添加子節點“單元格”
? ? ? ? ? ? tr.appendChild(del);//為 tr 添加子節點“單元格”
? ? ? ? ? ? var tr = document.getElementsByTagName("tr");//返回帶有指定標簽的集合;
? ? ? ? ? ? for (var i = 0; i < tr.length; i++) {
? ? ? ? ? ? ? ? bgcChange(tr[i]); ?//對tr標簽執行函數bgcChange,tr[i]作為參數,比如循環第一次,i=0,tr[0]就是第一個tr標簽,第一個標簽作為參數傳入bgcChange函數
? ? ? ? ? ? }
? ? ? ? }
? ? ? ? // 創建刪除函數
? ? ? ? function del(obj) {
? ? ? ? ? ? var tr = obj.parentNode.parentNode; ?//定義一個變量叫tr,tr的值為獲取到的參數的父元素的父元素,實際調用使用時,參數為a標簽,a標簽的父元素的父元素是tr標簽,變量tr此時是tr標簽
? ? ? ? ? ? tr.parentNode.removeChild(tr); ?//變量tr的父元素刪除子元素變量tr這個tr標簽,就是刪除自己這行
? ? ? ? }