zoukankan      html  css  js  c++  java
  • 吴裕雄--天生自然 JAVASCRIPT开发学习:对象 实例(2)

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
    </head>
    <body>
    
    <script>
    document.write("Hello World!");
    </script>
    
    </body>
    </html>

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
    </head>
    <body>
    
    <script>
    document.write("<h1>Hello World!</h1>");
    </script>
    
    </body>
    </html>

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
    </head>
    <body>
    
    <a name="html">HTML 教程</a><br>
    <a name="css">CSS 教程</a><br>
    <a name="xml">XML 教程</a><br>
    <a href="/js/">JavaScript 教程</a>
    
    <p>锚的数量:
    <script>
    document.write(document.anchors.length);
    </script></p>
    
    </body>
    </html>

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
    </head>
    <body>
    
    <a name="html">HTML 教程</a><br>
    <a name="css">CSS 教程</a><br>
    <a name="xml">XML 教程</a>
    
    <p>文档中第一个锚:
    <script>
    document.write(document.anchors[0].innerHTML);
    </script>
    </p>
    
    </body>
    </html>

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
    </head>
    <body>
    
    <form name="Form1"></form>
    <form name="Form2"></form>
    <form></form>
    <p>表单数目:
    <script>
    document.write(document.forms.length);
    </script></p>
    
    </body>
    </html>

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
    </head>
    <body>
    
    <form name="Form1"></form>
    <form name="Form2"></form>
    <form></form>
    <p>第一个表单名称:
    <script>
    document.write(document.forms[0].name);
    </script></p>
    
    </body>
    </html>

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
    </head>
    <body>
    
    <img border="0" src="klematis.jpg" width="150" height="113">
    <img border="0" src="klematis2.jpg" width="152" height="128">
    <p>图像数目:
    <script>
    document.write(document.images.length);
    </script></p>
    
    </body>
    </html>

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
    </head>
    <body>
    
    <img id="runoob1" border="0" src="klematis.jpg" width="150" height="113">
    <img id="runoob2" border="0" src="klematis2.jpg" width="152" height="128">
    <p>第一个图像的ID:
    <script>
    document.write(document.images[0].id);
    </script></p>
    
    </body>
    </html>

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
    </head>
    <body>
    
    <img src ="planets.gif" width="145" height="126" alt="Planets" usemap ="#planetmap">
    <map name="planetmap">
    <area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun">
    <area shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury">
    <area shape="circle" coords="124,58,8" href="venus.htm" alt="Venus">
    </map>
    <p><a href="/js/">JavaScript 教程</a></p>
    <p>链接/地址数目:
    <script>
    document.write(document.links.length);
    </script></p>
    
    </body>
    </html>

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
    </head>
    <body>
    
    <img src ="planets.gif" width="145" height="126" alt="Planets" usemap ="#planetmap">
    <map name="planetmap">
    <area id="sun" shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun">
    <area id="mercury" shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury">
    <area id="venus" shape="circle" coords="124,58,8" href="venus.htm" alt="Venus">
    </map>
    <p><a id="javascript" href="/js/">JavaScript 教程</a></p>
    <p>第一个链接/地址的ID:
    <script>
    document.write(document.links[0].id);
    </script></p>
    
    </body>
    </html>

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
    </head>
    <body>
    
    与此文档相关的Cookies: 
    <script>
    document.write(document.cookie);
    </script>
    
    </body>
    </html>

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
    </head>
    <body>
    
    加载这个文件的域名:
    <script>
    document.write(document.domain);
    </script>
    
    </body>
    </html>

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
    </head>
    <body>
    
    文档最后修改:
    <script>
    document.write(document.lastModified);
    </script>
    
    </body>
    </html>

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
    </head>
    <body>
    
    本文档的引用地址:
    <script>
    document.write(document.referrer);
    </script>
    
    </body>
    </html>

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
    </head>
    <body>
    
    文档的标题为: 
    <script>
    document.write(document.title);
    </script>
    
    </body>
    </html>

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
    </head>
    <body>
    
    文档的完整的URL: 
    <script>
    document.write(document.URL);
    </script>
    
    </body>
    </html>

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
    <script>
    function createDoc(){
        var doc=document.open("text/html","replace");
        var txt="<!DOCTYPE html><html><body>学习 HTML DOM 很有趣!</body></html>";
        doc.write(txt);
        doc.close();
    }
    </script>
    </head>
    
    <body>
    <input type="button" value="新文档" onclick="createDoc()">
    </body>
    </html>

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
    </head>
    <body>
    
    <p>注意write()方法不会在每个语句后面新增一行:</p>
    <pre>
    <script>
    document.write("Hello World!");
    document.write("Have a nice day!");
    </script>
    </pre>
    <p>注意writeln()方法在每个语句后面新增一行:</p>
    <pre>
    <script>
    document.writeln("Hello World!");
    document.writeln("Have a nice day!");
    </script>
    </pre>
    
    </body>
    </html>

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
    </head>
    <head>
    <script>
    function getValue(){
      var x=document.getElementById("myHeader");
      alert(x.innerHTML);
    }
    </script>
    </head>
    <body>
    
    <h1 id="myHeader" onclick="getValue()">点击我!</h1>
    
    </body>
    </html>

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
    <script>
    function getElements(){
        var x=document.getElementsByName("x");
        alert(x.length);
    }
    </script>
    </head>
    <body>
    
    猫:
    <input name="x" type="radio" value="猫">
    狗:
    <input name="x" type="radio" value="狗">
    <input type="button" onclick="getElements()" value="多少名称为 'x'的元素?">
    
    </body>
    </html>

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
    <script>
    function getElements(){
      var x=document.getElementsByTagName("input");
      alert(x.length);
    }
    </script>
    </head>
    <body>
    
    <input type="text" size="20"><br>
    <input type="text" size="20"><br>
    <input type="text" size="20"><br><br>
    <input type="button" onclick="getElements()" value="多少input元素?">
    
    </body>
    </html>

  • 相关阅读:
    天线设计相关性能参数
    为什么在晶振上并电阻?
    晶体谐振器 晶体振荡器 正确区分
    示波器入门之采样率、存储深度
    示波器你了解多少?存储深度是什么?
    数字时序:时钟信号、抖动、迟滞和眼图
    信号完整性与电源完整性的详细分析
    信号完整性入门笔记三---阻抗及影响阻抗的因素
    H5——条件注释
    H5——meta
  • 原文地址:https://www.cnblogs.com/tszr/p/11007860.html
Copyright © 2011-2022 走看看