zoukankan      html  css  js  c++  java
  • DOM操作指令

    查找元素:

    document.getElementById 查找元素的id,由于id是唯一的,所以查找出的是一个单独的变量;

    document.getElementsByClassName  利用类名查找拥有相同类名的所有元素,由于多个元素可以共用一个类名,所以get到的为一个数组,在利用循环语句进行操作时,不能忘记使用下标;

    document.getElementsByTagName 标签名查找,数组;

    document.getElementsByName 数组;

    操作内容:

    非表单元素时在其后或者为其创建的变量名后加 .innerHTML来获取元素中的内容;

    表单元素加 .value获取其值;

    利用等号=来修改获取的内容

    x.innerHTML = xxx;
    x.value = xxx;

    操作属性:

    getAttribute 获取元素中的某一项属性

    x.getAttribute("class属性的名称/id名称/自定义属性名称");

    setAttribute 设置元素中的某一项属性

    x.setAttribute("属性名称","需要修改的值");

    removeAttribute 移除元素中的某一项属性

    x.removeAttribute("属性名称");

    操作样式:

    元素名称.style.样式名称 = "需要修改或添加的样式";
    x.style.width = "100px";

    或者在style标签中设置好style样式,再利用setAttribute修改元素中属性来达到变换样式操作

     1 <head>
     2 <style>
     3         #div1{
     4          50px;
     5         height: 50px;
     6         background-color: aqua;
     7     }
     8     #div2{
     9          50px;
    10         height: 50px;
    11         background-color: aqua;
    12     }
    13 </style>
    14 </head>
    15 
    16 <body>
    17 <script>
    18     function myFunction(){
    19         var a = document.getElementById("div1");
    20         a.setAttribute("div1","div2");
    21     }
    22     </script>
    23     <div id="div1" onClick="myFunction()"></div>
    24 </body>
    25 </script>

    用js来创建元素:

    createElement

    document.createElement("标签名");

    追加元素:

    appendChild

    被追加的元素名.appendChild(追加元素);

    删除元素:

    remove

    元素对象.remove;

    限时延迟:

    timeout 一次性的限时,只执行一次

    interval 延迟,循环,秒表什么的可以用这个

  • 相关阅读:
    计算机网络基础 汇总
    指针与数组
    卡特兰数
    Leetcode Sort Colors
    Leetcode Group Shifted Strings
    Leetcode Summary Ranges
    Leetcode Count Primes
    Leetcode Reverse Words in a String II
    Leetcode Reverse Words in a String
    Leetcode Rotate Array
  • 原文地址:https://www.cnblogs.com/wangqun1234/p/7680654.html
Copyright © 2011-2022 走看看