js中常用document对象方法

open()　　打开一个流，以收集来自任何 write() 或 writeln() 方法的输出。新建文档，覆盖原来的文档内容

close()　　关闭用 document.open() 方法打开的输出流，并显示选定的数据。

write()　　向文档写 HTML 表达式 或 JavaScript 代码。

writeln()　　等同于 write() 方法，不同的是在每个表达式之后写一个换行符。

getElementById()　　返回对拥有指定 id 的第一个元素的引用。

getElementsByName()　　返回带有指定名称的元素集合。

getElementsByTagName()　　返回带有指定标签名的元素集合。

getElementsByClassName()　　返回带有指定类样式的元素集合。

示例：

 

<form>
                <table border="" cellspacing="" cellpadding="" >
                    <tr><td>姓名</td><td><input id="uesrName" type="text" name="userName"/></td></tr>
                    <tr><td>密码</td><td><input type="password" name="usePwd"/></td></tr>
                    <tr><td>性别</td><td><input type="radio" class="sex" name="sex" value="男"/>
                    <input type="radio" class="sex" name="sex" value="女人" />女</td></tr>
                    <tr><td>爱好</td><td><input type="checkbox" name="hobby" value="篮球"  />篮球<br />
                                <input type="checkbox" name="hobby" value="游泳"  />游泳<br />
                                <input type="checkbox" name="hobby" value="登山"  />登山<br />
                                <input type="checkbox" name="hobby" value="看书"  />看书<br />
                        </td></tr>
                </table>
            </form>

<script type="text/javascript">
            
        var id1 = document.getElementById("uesrName");
        console.log(id1.outerHTML);
        
        var tag = document.getElementsByTagName("input");
        for(var i = 0 ; i < tag.length ; i ++ ){
            console.log(tag[i].outerHTML);
        }
        var nam = document.getElementsByName("hobby");
        for(var i = 0 ; i < nam.length ; i ++ ){
            console.log(nam[i].outerHTML);
        }
        var clas = document.getElementsByClassName("sex");
        for(var i = 0 ; i < clas.length ; i ++ ){
            console.log(clas[i].outerHTML);
        }
        </script>

querySelectorAll()　　根据选择器查找元素，返回元素集合，无论选择器找到的元素有多少，都会返回元素集合（NodeList），如果未找到匹配的元素，则返回空集合

querySelector　　根据选择器查找元素，返回单个元素，无论选择器找到的元素有多少，只会返回第一个匹配的元素，如果未找到匹配的元素，则返回null。

function checkbox(){
        var al = document.querySelector("#all");//查找id为all的元素
        var lis1 = document.querySelectorAll(".lis");//查找类样式为lis的所有元素
        for( var i = 0 ; i< lis1.length; i++ ){
            if(al.checked == true){
                lis1[i].checked=true;
                //可以省略后面的== true。。或者判断改为lis1.checked=al.checked;
            }
            if(al.checked == false){
                lis1[i].checked=false;
                
            }
        }
    }

element.cloneNode()　　克隆元素。

element.removeChild()　　从元素中移除子节点。

例：

点击对应按钮实现对应功能（最后一个复制最后一行我把它和第一个按钮合并做了）

//css
body{
    font-size:13px;
    line-height:25px;
    }
table{
    border-top: 1px solid #333;
    border-left: 1px solid #333;
    width:300px;
}
td{
    border-right: 1px solid #333;
    border-bottom: 1px solid #333;
    }
.center{
    text-align:center;
}
.biaot{
    background-color: gray;
    font-weight: 500;
    text-align: center;
}

//html
<table class="table1" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td>书名</td>
    <td>价格</td>
  </tr>
  <tr>
    <td>看得见风景的房间</td>
    <td class="center">&yen;30.00</td>
  </tr>
  <tr id="last1">
    <td>60个瞬间</td>
    <td class="center" >&yen;32.00</td>
  </tr>
</table>
<input name="b1" type="button" onclick="add1()"  value="增加一行" />
<input name="b2" type="button"  onclick="delate1()"  value="删除第二行" />
<input name="b3" type="button"  onclick="xg()"  value="修改标题样式" />
<input name="b4" type="button"   value="复制最后一行" />

var table2 = document.querySelector(".table1 tbody");
    
    function add1(){
        var clon = document.querySelector("#last1");
        var clon1 = clon.cloneNode( true );
        table2.appendChild(clon1 );
        
    }
    function delate1(){
        var senond = document.querySelector("table tbody tr:nth-child(2)");
        table2.removeChild(senond);
    }
    function xg(){
        var bt1 = table2.querySelector("tr:first-child");
        bt1.className = "biaot"
        
    }

最后加一个js在循环中定义函数的问题

var names = ["arr1","arr2","arr3","arr4","arr5"];
var funName = [];
for(var i =0 ; i < names.length ; i++){
      funName[i] = function(){
              return names[i];    
         }  
  }  
var end = funNames[0]();
console.log(end);
//为使循环中不会共享一个i值，可以把var改为块级作用域的let。