zoukankan      html  css  js  c++  java
  • 10.29JavaScriptDOM

    DOM简单学习:为了满足案例要求
        * 功能:控制html文档的内容
        * 获取页面标签(元素)对象:Element
            * document.getElementById("id值"):通过元素的id获取元素对象

        * 操作Element对象:
            1. 修改属性值:
                1. 明确获取的对象是哪一个?
                2. 查看API文档,找其中有哪些属性可以设置
            2. 修改标签体内容:
                * 属性:innerHTML
                1. 获取元素对象
                2. 使用innerHTML属性修改标签体内容

    ## 事件简单学习
        * 功能: 某些组件被执行了某些操作后,触发某些代码的执行。
            * 造句:  xxx被xxx,我就xxx
                * 我方水晶被摧毁后,我就责备对友。
                * 敌方水晶被摧毁后,我就夸奖自己。

        * 如何绑定事件
            1. 直接在html标签上,指定事件的属性(操作),属性值就是js代码
                1. 事件:onclick--- 单击事件

            2. 通过js获取元素对象,指定事件属性,设置一个函数

            * 代码:
                <body>
                    <img id="light" src="img/off.gif"  onclick="fun();">
                    <img id="light2" src="img/off.gif">
                    
                    <script>
                        function fun(){
                            alert('我被点了');
                            alert('我又被点了');
                        }
                    
                        function fun2(){
                            alert('咋老点我?');
                        }
                    
                        //1.获取light2对象
                        var light2 = document.getElementById("light2");
                        //2.绑定事件
                        light2.onclick = fun2;
                    
                    
                    </script>
                </body>
       

  • 相关阅读:
    Windows系统环境变量path优先级测试报告
    URI和URL的区别
    智能引导式报错(Class file name must end with .class)
    【Algorithm】冒泡排序
    【C语言】练习2-9
    【C语言】练习2-8
    【C语言】练习2-1
    【C语言】练习1-23
    【C语言】练习1-22
    【C语言】练习1-21
  • 原文地址:https://www.cnblogs.com/zhaoyids/p/14145834.html
Copyright © 2011-2022 走看看