4.1 windows操作练习

 windows对象  窗口
       <div id="a" e="w" style=" background-color:#C03; width:100px; height:40px;"><span>document对象 html文档内容</span></div>
       <span id="r" onclick="Xiu()">这是元素</span>
       <div class="b">这是元1素</div>
       <span class="b">这是元素2</span>
       <input type="button" value="按钮" name="c"  id="b"/>
       <input type="text" id="d" />
    </body>
    <script type="text/javascript">
        //1.找元素
        //通过id找元素
        //var a = document.getElementById("a");
        //alert(a);
        //通过class找元素
        //var b = document.getElementsByClassName("b");
        //alert(b[1]);
        //通过标签找元素
        //var c = document.getElementsByTagName("span");
        //alert(c[1]);
        //表单元素通过name
        //var d = document.getElementsByName("c");
        //alert(d[0]);
        
        
        //2.操作
        //操作内容
        //找到元素
        //var a = document.getElementById("a");
        //获取内容
        //alert(a.innerText);
        //修改内容
        //a.innerText = "修改的内容";    
        //获取内容（含标签）
        //alert(a.innerHTML);
        //修改内容（加其他的标签）
        //a.innerHTML = "<b>这是修改的带有标签的内容</b>";
        
        
        //操作属性
        //找元素
        //var a = document.getElementById("a");
        //获取属性
        //alert(a.getAttribute("e"));
        //修改属性
        //a.setAttribute("e","e");
        //删除属性
        //a.removeAttribute("e");
        
        /*var c = document.getElementById("d");
        c.value = "nihojo";*/
        
        //操作样式(只能操作内联的)
        //找元素
        //var a = document.getElementById("a");
        //获取样式
        //alert(a.style.width);
        //alert(a.style.color);
        //修改样式
        //a.style.backgroundColor = "green";
        
        
        //通过方法修改样式
        /*function Xiu()
        {
            //找元素
            var r = document.getElementById("r");    
            //修改背景色
            r.style.backgroundColor = "green";
        }*/

     js dom操作对象       

这样就可以找到dom对象，并且给按钮添加事件。