zoukankan      html  css  js  c++  java
  • javascript HTML DOM

    一、简介:

    通过HTML DOM可以访问javascript  HTML文档的所有元素;

    1、javascript可以改变页面中的所有HTML的元素、属性、样式  以及对事件作出反应;

    2、查找HTML元素:

    可以通过id查找:var x=document.getElementById("id1");

    通过表签名查找:var y=document.getElementsByTagName("div");

    二、DOM  HTML

    1、创建动态的HTML内容:

    document.write(“今天的日期是”+Date());    //在页面中输出今晚的日期
    

      注意:绝不要在文档加载之后时候使用document.write(),不然会覆盖文档;

    2、改变HTML内容;

    修改HTML内容最佳方式是使用innerHTML属性;

    document.getElementById("id2").innerHTML="new content";
    

      

    3、改变HTML属性:

    document.getElementById("id2").title="this is a story";
    

      

    三、DOM CSS

    1、改变HTML元素的样式;element.style.prototype="nwe style"

    document.getElementById(”P2“).style.color="red";
    

      

    四、DOM事件

    onclick事件举例:

    document.getElementById('mybtn').onclick=function(){
      alert("hello world");
    };
    

      1、事件句柄

        能够使HTML事件触发浏览器中的行为,比如当某个用户点击HTML元素启动一段代码时,可插入HTML标签以定义事件行为;

    如:onblur()    onchange()  oncick()等事件

      2、鼠标/键盘属性

    altKey() 事件触发时 alt键被按下时

      3、IE属性

      4、标准Event属性

      5、标准Event方法

    五、DOM节点

      1、创建节点

        createElement(”div“)  

        createTexeNode(”content“)  

    var para=document.createElement("p");               //创建元素节点 
    var node=document.createTextNode("段落内容")    //文本节点创建
    

      2、插入节点appendChild()  

    para.appendChild(node);
    

      3、删除节点 removeChild()  

    <div id="div1">
    <p id="p1">这是一个段落。</p>
    <p id="p2">这是另一个段落。</p>
    </div>
    
    <script>
    var parent=document.getElementById("div1");
    var child=document.getElementById("p1");
    parent.removeChild(child);
    </script>
    

     

  • 相关阅读:
    服务器磁盘脱机无法挂载
    go 字符串操作相关
    golang 系列:atomic 原子操作
    UUID简介及 Golang实现
    go 图片base64转二进制
    golang go 中字符串和各种int类型之间的相互转换方式
    Go 获取当前时间 时间格式的转换 秒、毫秒、纳秒时间戳输出
    Go语言中调用C语言类型转换篇
    Supervisor 部署go gin服务 或在Linux下面独立部署
    Go语言对字符串进行SHA1 哈希运算的方法
  • 原文地址:https://www.cnblogs.com/zhuyucun/p/6276776.html
Copyright © 2011-2022 走看看