Javascript学习记录2021.05.31

1.变量

var: 全局变量，整个js文件里都能访问到

let: 块变量，只有程序块内部能访问到

变量的初始化：

例如String、Date等变量可以使用new和构造器进行初始化，而html中的部分标签如：<tr>、<table>、<td>、<div>等则可以使用 document.createElement('标签名') 的方式初始化。

变量的获取：

对于拥有id的变量，可以使用 document.getElementById("id") 的方式获取

 

2.Table内部标签的操作

tableStud.insertRow(index)：table在指定位置添加一行

let newTr = tableStud.insertRow(rowNumber);
newTr.innerHTML = "<tr></tr>"

函数样式： 

function funcName(obj){
    alert("this is a function" + obj);
}

获取父标签：

<tr>
		<td><input type="checkbox" onclick="inputsCheck(this)"/></td>
</tr>

function inputsCheck(objCheck) {
    let trParent = objCheck.parentNode.parentNode;
}

<th>设置style：

let topTr = document.getElementById("topTr");
var newTh = topTr.insertCell();
newTh.style.backgroundColor = "#a7c942";
newTh.style.color = "#fff";
newTh.style.fontWeight= "bold";

<button>设置禁用（disable）或者设置启用（enable）和style：

let submitButton = document.getElementById("button");
submitButton.style.backgroundColor = "orange";
submitButton.style.border = "orange";
// 设置启用（enable）
submitButton.removeAttribute("disabled");
// 设置禁用（disable）
submitButton.setAttribute("disabled","true");

<tr>删除某个<td>（内部的Cell）：

// <tr>删除最后一个<td>
trParent.deleteCell(trParent.cells.length - 1);

<table>获取某个内部标签的array：

let rows = document.getElementById("myTable").getElementsByTagName('tr');

获取<table>中特定行<tr>的下一行<tr>，并判断下一列是否为指定类名：

for (let i = 1; i < rows.length; i++){
    // find current tr
    if (rows[i] == trParent){
      // check next tr is dropDownTextArea or not
      if(i+1 < rows.length && rows[i+1].className == "dropDownTextArea"){
        rows[i+1].parentNode.removeChild(rows[i+1]);
        rowNumber--;
        break;
      }
      break;
    }
  }

在父标签里删除自己：

trParent.parentNode.removeChild(trParent);

向特定<tr>后添加一个<tr>：

let trParent = objImg.parentNode.parentNode;
let newTr = document.createElement('tr');
newTr.innerHTML = "<tr></tr>";
trParent.after(newTr);