zoukankan      html  css  js  c++  java
  • <JavaScript><DOM> 十一. 核心DOM的方法

     1 <!DOCTYPE html>
     2 <html>
     3 <head>
     4     <title></title>
     5 <script type="text/javascript">
     6 
     7 window.onload = function () {
     8 
     9     // ----------------- 节点的方法 -----------------
    10     // ----------------- 节点属性的方法 -----------------
    11     /*
    12         setAttribute(name, value) 给节点添加属性
    13         getAttribute(name) 获取节点属性的值
    14         removeAttribute(name) 删除节点属性
    15     */
    16     // body节点
    17     var node_body = document.body;
    18 
    19     // img节点
    20     var node_img = node_body.firstChild;
    21 
    22     // 增加属性
    23     node_img.setAttribute("src", "images/001.jpg");
    24     node_img.setAttribute("width", "200");
    25     node_img.setAttribute("border", "3");
    26     node_img.setAttribute("style", "cursor:pointer;");
    27 
    28     // 删除属性
    29     node_img.removeAttribute("border");
    30 
    31     // ----------------- 节点的操作 -----------------------
    32     /*
    33         createElement(tagName) 创建一个HTML标记, 一个节点
    34         appendChild() 将创建的子节点, 追加到某个父节点下
    35         removeChild() 删除子节点
    36     */
    37     // 创建img节点
    38     var imgObj = document.createElement("img");
    39 
    40     // 增加属性
    41     imgObj.setAttribute("src", "images/002.jpg");
    42     imgObj.setAttribute("width", "200");
    43     imgObj.setAttribute("border", "3");
    44 
    45     // 追加到body节点下
    46     node_body.appendChild(imgObj);
    47 }
    48 
    49 </script>
    50 </head>
    51 <body><img />
    52 </body>
    53 </html>
  • 相关阅读:
    CodeForces 446A. DZY Loves Sequences(最长上升子序列)
    CodeForces
    2020牛客暑期多校训练营(第一场)
    POJ3281-Dining(最大流)(拆点)
    「杂题」图论杂题选做
    「学习小结」CDQ 分治多维偏序问题
    「算法笔记」Tarjan 算法 双连通分量
    「算法笔记」状压 DP
    「算法笔记」数位 DP
    「算法笔记」矩阵乘法
  • 原文地址:https://www.cnblogs.com/ZeroHour/p/6370378.html
Copyright © 2011-2022 走看看