zoukankan      html  css  js  c++  java
  • DOM简单学习

    第一节 DOM简单学习:为了满足案例要求

    1.功能:

    控制HTML文档内容

    2.获取页面标签(元素)对象:Element

    如:document.getElementById("id值"):通过元素的id获取元素对象

    3.操作Element对象:

    1.修改属性值

    1. 明确获取对象
    2. 查看API文档,找其中有那些属性可以设置

    2.修改标签体内容:

    • 属性:innerHTML
      1. 获取元素对象
      2. 使用innerHTML属性修改标签内容
    <h1 id = "title">
        阿里巴巴
    </h1>
    var title = document.getElementById("title");
    alter("更换内容");
    title.innerHTML = "京东";
    

    案例一 电灯开关

    <body>
        <img id = "light" src = "img/off.gif">
        <script>
        	// 1.获取图片对象
            var light = document.getElememtById("light");
            // 2.绑定单击事件
            light.onclick = function(){
                if(flag){
                    // 判断如果灯是开的,则灭掉
                    light.src = "img/off.gif";
                    flag = false;
                }else{
                    // 如果灯是灭的,则打开
                    light.src = "img/on.fig";
                    flag = true;
                }
            }
        </script>
    </body>
    

  • 相关阅读:
    LINQ基础——WHERE子句
    LINQ基础——LET子句
    LINQ基础——FROM子句
    Guid(全局统一标识符)
    ??运算符
    多线程的AutoResetEvent
    线程池(ThreadPool)
    Mutex
    Monitor类实现线程同步
    【java框架】MyBatis(7)--MyBatis注解开发
  • 原文地址:https://www.cnblogs.com/anke-z/p/12920031.html
Copyright © 2011-2022 走看看