zoukankan      html  css  js  c++  java
  • DOM属性和事件

    1-22 DOM属性设置与获取

     
    1、获取属性:
    getAttribute("attribute");
    var p = document.getElementById("text");
    // 获取p标签本身具有的id和align属性:
    // 方法:*.id、*.align(class属性除外)
    console.log(p.id);
    console.log(p.align);
    // 如果想获取自定义的属性,得用此方法:
    console.log(p.getAttribute("data-opq"));
    var input = document.getElementById("user");
    console.log(user.name);
    2、设置属性:
    // 给p标签设置一个data-color属性:
    p.setAttribute("data-color","red");//p.setAttribute("属性名","属性值")
    user.setAttribute("isRead","false");
    3、 删除属性:

    p.removeAttribute("align");

    · 2-9 DOM0级事件

     
    DOM0级事件
    语法:ele.事件 = 执行脚本
    功能:在DOM对象上绑定事件
    说明:执行脚本可以使一个匿名函数,也可以是一个函数的调用,如果调用函数,语法是:ele.事件=函数名,不加括号
    不建议使用HTML事件原因: 1.多元素绑定相同事件时,效率低 2.不建议在HTML元素中写JS代码
     1 <script>
     2 var btn=document.getElementById("btn");
     3 btn.onclick=function(){
     4     //判断如果按钮时锁定,则显示为解锁,变为灰色,否则显示为锁定,变为蓝色
     5     if(this.className=="lock"){
     6         this.className="unlock";
     7         this.innerHTML="解锁";
     8         this.style.backgrouncolor="gray";
     9     }else{
    10         this.className="lock";
    11     this.innerHTML="锁定";
    12     }
    13     
    14 }
    15 </script>
    </style>
    <body>
        <div id="btn" class="lock">锁定</div>
    </body>
    <script>
    var btn=document.getElementById("btn");
    function clickBtn(){
        alert("我是按钮");
    }
    //点击按钮调用clickBtn这个函数
    btn.onclick=clickBtn;//此时调用的不是匿名函数时不要写小括号
    </script>

     原图在这

  • 相关阅读:
    Python 学习日记 第七天
    Python 学习日记 第六天
    Python 学习日记 第五天
    Python 学习日记 第四天
    Redis 中的数据类型及基本操作
    Asp.net mvc 中View 的呈现(二)
    Asp.net mvc 中View的呈现(一)
    Asp.net mvc 中Action 方法的执行(三)
    Asp.net mvc 中Action 方法的执行(二)
    Asp.net mvc 中Action 方法的执行(一)
  • 原文地址:https://www.cnblogs.com/lvlisn/p/11626334.html
Copyright © 2011-2022 走看看