getElementById的用法

getElementById的用法    getElementById是通过Id来设置/返回HTML标签的属性及调用其事件与方法。用这个方法基本上可以控制页面所有标签,条件很简单,就是给每个标签分配一个ID号。    返回具有指定ID属性值的第一个对象的一个引用。    语法:    Element=document.getElementByIdx_x_x(“id”)    …

大家好,又见面了,我是你们的朋友全栈君。

        getElementById是通过Id来设置/返回HTML标签的属性及调用其事件与方法。用这个方法基本上可以控制页面所有标签,条件很简单,就是给每个标签分配一个ID号。

       返回具有指定ID属性值的第一个对象的一个引用。

       语法:

       Element = document.getElementByIdx_x_x(“id”)

       获得ID值=id的所有属性和方法

       JS中经常使用它通过控件ID取得元素的值,如一个form里包含text、label等,他们都是FORM的元素,有一个分配的ID,getElementById()是取得这些元素的text值的。

 

    实例1:

<html>
  <head>
  </head>
  <body>
    <input id="inTag" name="inName" value="bijian" type="text" />
    <input type="submit" value="获取值" onClick="getValue()"/>
  </body>
  <script language="javascript">
     window.onload = function run(){   
         var inTag = document.getElementByIdx_x("inTag"); 
                  inTag.value = "hello!";
     }
    
     function getValue() {
              var inTag = document.getElementByIdx_x("inTag");
              alert(inTag.value);
     }
  </script>
</html>

 

    实例2:

<html>
  <head>
      <title>getElementById</title>
  </head>
  <body>
    <a id="mr" href="http://www.baidu.com/">百度</a>
    <form name="myform">
        <input type="button" value="更换连接" onClick="change()"/>
    </form>
  </body>
  <script language="javascript">
     function change() {
             document.getElementByIdx_x("mr").innerHTML = "金山123";
             document.getElementByIdx_x("mr").href="http://123.duba.net/";
     }
  </script>
</html>

   

    实例3:

<html>
  <head>
      <title>getElementById</title>
  </head>
  <body>
    <h1 id="divTest" οnmοusemοve="s()" οnmοuseοut="reset()" align="center">这是一个有感觉的标记</h1>
  </body>
  <script language="javascript">
     function reset() {
             var divTest = document.getElementByIdx_x("divTest");
             divTest.innerHTML = "这是一个有感觉的标记";
     }
     function s()  {
             var divTest = document.getElementByIdx_x("divTest");
             divTest.innerHTML = "老鼠来了";
     }
  </script>
</html>

   

    实例4:

<html>
  <head>
      <title>getElementById4</title>
  </head>
  <body>
    <font ID=main_title size=6><b>虚拟网络世界</b></font>
  </body>
  <script language="javascript">
     var n = 0;
     function changefontcolor() {
             n=n%4;
             switch(n) {
                 case 0:
                         main_title.color="red";
                         break;
                 case 1:
                         main_title.color="green";
                         break;
                 case 2:
                         main_title.color="blue";
                         break;
                 case 3:
                         main_title.color="yellow";
             }
             n++;
     }
     //定时执行函数每秒钟调用changefontcolor()函数一次,改变大标题的颜色
     setInterval("changefontcolor()",1000);
  </script>
</html>

   

    实例5:

<html>
  <head>
      <title>getElementById5</title>
  </head>
  <body onKeypress="showCapture()">
    <h1 ID="num" align="center">0000</h1>
  </body>
  <script language="javascript">
       var r;
       function showNextNum() {
               var m_num=Math.floor(Math.random()*(3000-1000))+1000;
               num.innerHTML = m_num;
       }
       function showCapture() {
               clearTimeout(r);
       }
     r = setInterval("showNextNum()",100);
  </script>
</html>
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/159586.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

  • 企业微信三方应用开发(二)授权开通及登录流程(第三方登录流程)

    据微信开放平台“开发资源”中网站应用微信登陆功能开发指南描述:进行授权登陆接入前,需要先注册一个开发者账号,并拥有一个已经审核通过的网站应用,并获取AppID和APPSecret,然后申请微信登陆并通过审核后,可以接入流程进行开发。据开发者资质认证处介绍:开发者资质认证通过后,微信开放平台帐号下的应用,将获得微信登录、智能接口、第三方平台开发等高级能力。所以在微信第三方授权登陆获取用户信息…

  • SQL中的cast()函数「建议收藏」

    SQL中的cast()函数「建议收藏」CAST函数用于将某种数据类型的表达式显式转换为另一种数据类型。CAST()函数的参数是一个表达式,它包括用AS关键字分隔的源值和目标数据类型。语法:CAST(expressionASdata_type)expression:任何有效的SQServer表达式。AS:用于分隔两个参数,在AS之前的是要处理的数据,在AS之后是要转换的数据类型。data_type:目标系统所提供的

  • SpringMVC面试题总结「建议收藏」

    SpringMVC面试题总结「建议收藏」前言:SpringMVC的面试题常见的也就那几种,本文我打算分为两个方向为大家介绍SpringMVC的面试题。第一部分将从源码的执行的角度分析SpringMVC(以后简称MVC)第二部分将从面试官常问的SpringMVC面试题取介绍SpringMVC源码介绍1.http://localhost:8000/hello这个路径的执行流程是怎么走的流程大致分析一下:首先会请求会进入前…

  • hackbar v2

    hackbar v2功能和以前的hackbar一样,用户量不多啊~.~

  • ibatis isnotequal_英语中is和are的用法

    ibatis isnotequal_英语中is和are的用法一:isEquals用于动态拼接sql如下实例:如果status的状态为0,则更新attribute1;状态为1,则更新attribute2;状态为2,则更新attribute3。&lt;updateid="topup.doEffect"parameterClass="java.util.HashMap"&gt;updatecis_customersetcode_id=…

  • 使用fiddler抓包工具替换网站文件

    使用fiddler抓包工具替换网站文件

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号