zoukankan      html  css  js  c++  java
  • DOM学习日记1

    1、通过 id 查找 HTML 元素

    var x=document.getElementById("intro");

    2、通过标签名查找 HTML 元素
    本例查找 id="main" 的元素,然后查找 "main" 中的所有 <p> 元素:

    var x=document.getElementById("main");
    var y=x.getElementsByTagName("p");

    3、改变 HTML 属性
    本例改变了 <img> 元素的 src 属性:

    <!DOCTYPE html>
    <html>
    <body>
    
    <img id="image" src="smiley.gif">
    
    <script>
    document.getElementById("image").src="landscape.jpg";
    </script>
    
    </body>
    </html>

    4、改变 HTML 样式
    如需改变 HTML 元素的样式,请使用这个语法:

    document.getElementById(id).style.property=new style
    

    例子 1
    下面的例子会改变 <p> 元素的样式:

    <p id="p2">Hello World!</p>
    <script>
    document.getElementById("p2").style.color="blue";
    </script>

    5、本例改变了 id="id1" 的 HTML 元素的样式,当用户点击按钮时:

    <h1 id="id1">My Heading 1</h1>
    <button type="button" onclick="document.getElementById('id1').style.color='red'">

    6、Visibility
    如何使元素不可见。您希望元素显示或消失吗?

    <p id="p1">这是一段文本。</p>
    
    <input type="button" value="隐藏文本" onclick="document.getElementById('p1').style.visibility='hidden'" />
    <input type="button" value="显示文本" onclick="document.getElementById('p1').style.visibility='visible'" />

    7、DOM事件
    1、在本例中,当用户在 <h1> 元素上点击时,会改变其内容:

    <h1 onclick="this.innerHTML='谢谢!'">请点击该文本</h1>

    2、onload 和 onunload 事件

    onload 和 onunload 事件会在用户进入或离开页面时被触发。
    onload 事件可用于检测访问者的浏览器类型和浏览器版本,并基于这些信息来加载网页的正确版本。
    onload 和 onunload 事件可用于处理 cookie。
  • 相关阅读:
    编码问题
    僵尸进程与孤儿进程
    进程理论 阻塞非阻塞 同步异步 I/O操作
    浏览器上网流程以及套接字介绍
    OSI七层模型
    JsonResponse返回中文乱码问题
    查看源码所在位置
    linux ssh登录的小知识
    centos7安装python3.6
    Jquery的使用
  • 原文地址:https://www.cnblogs.com/zhenghongxin/p/4278650.html
Copyright © 2011-2022 走看看