javascript中document.getElementById的常用例子

改变 HTML 属性

如需改变 HTML 元素的属性，请使用这个语法：
 

 代码如下 复制代码
document.getElementById(id).attribute=new value

本例改变了 元素的 src 属性：

 代码如下 复制代码

<img id="image" src="smiley.gif" alt="" />
 
<script type="text/javascript">
document.getElementById("image").src="landscape.jpg";
</script>

改变 HTML 样式

如需改变 HTML 元素的样式，请使用这个语法：

 代码如下 复制代码

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

下面的例子会改变

元素的样式：
 
Hello World!
 

 代码如下 复制代码
<script type="text/javascript">
document.getElementById("p2").style.color="blue";
</script>

document.getelementbyid(...)' 为空或不是对象

 

 代码如下 复制代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.111cn.net /1999/xhtml">
<head>
    <title>无标题页</title>
    <style type="text/css">
    body
    {
        font-family:"宋体";
        font-size:12px;
    }
    </style>
    <script language="javascript" type="text/javascript">
    document.getElementById("divTest").innerHTML="Hello World";
    //页面加载完这段javascript代码的时候，就开始运行了，但是，下面的id为divTest div标签还未加载，所以找不到它
    </script>
</head>
<body>
    <div id="divTest">
    </div>
</body>
</html>
时间： 2024-08-01 04:49:29

javascript中document.getElementById的常用例子的相关文章

JAVASCRIPT中document.getElementById使用方法

改变 HTML 属性 如需改变 HTML 元素的属性,请使用这个语法: document.getElementById(id).attribute=new value 本例改变了  元素的 src 属性: <img id="image" src="smiley.gif" alt="" />     <script type="text/javascript"> document.getElementBy

js基础之DOM中document对象的常用属性方法详解_javascript技巧

-----引入 每个载入浏览器的 HTML 文档都会成为 Document 对象. Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问. 属性 1  document.anchors  返回对文档中所有 Anchor 对象的引用.还有document.links/document.forms/document.images等 2  document.URL       返回当前文档的url 3  document.title       返回当前文档的标题 4  do

JavaScript中document对象使用详解_基础知识

对象属性 复制代码 代码如下: document.title                 //设置文档标题等价于HTML的<title>标签 document.bgColor               //设置页面背景色 document.fgColor               //设置前景色(文本颜色) document.linkColor             //未点击过的链接颜色 document.alinkColor            //激活链接(焦点在此链接上)的

JavaScript中document.forms[0]与getElementByName区别_javascript技巧

首先我们来看个示例: 复制代码 代码如下: <form name="buyerForm" method="post" action="/mysport/control/user/list.do"> <input type="checkbox" id="usernames" value="testtest" >testtest<br> <input

javascript中document对象详解

注:页面上元 素name属性和JavaScript引用的名称必须一致包括大小写 否则会提示你一个错误信息 "引用的元素为空或者不是对象\\\\\" ----------------------- 对象属性 document.title //设置文档标题等价于HTML的title标签 document.bgColor //设置页面背景色 document.fgColor //设置前景色(文本颜色) document.linkColor //未点击过的链接颜色 document.alink

Javascript中document.createElement用法与兼容性

W3C DOM Level2 Core规定,Document 接口下的 createElement 方法可以创建一个元素节点对象实例.它可以传入一个字符串参数 tagName,在 HTML 中,这个参数可以是任何形式,但tagName 应为一个合法的标签名. 例如:document.createElement("td");//创建一个td      若 tagName 中出现不合法的字符,则应抛出 INVALID_CHARACTER_ERR 异常.      由于微软的强大,其产品IE

Javascript中三目运算用法例子

在JavaScript中,除了 if ... else 和 switch 语句,还有一个唯一的三目运算符 ? ... : ,也可用于简单的选择结构. 语法: conditions ? statementA : statementB ; 上述语句,首先判断条件condition,若结果为真则执行语句statementA,否则执行语句statementB. 值得注意的是,由于 JavaScript 脚本解释器将分号" ; "作为语句的结束符,statementA 和 statementB

javascript中Math.random()随机数的例子

定义和用法 random() 方法可返回介于 0 ~ 1 之间的一个随机数. 语法 Math.random() 返回值 0.0 ~ 1.0 之间的一个伪随机数. 打开Node,进入终端命令行模式,输入Math.random():   >Math.random()   0.436846193857491 结果是不是依旧如同往常一样稀松平常的小于1的一个伪随机数跳了出来呢. 这个时候,如果别人问你,还有什么其他方案可以生成随机数么,你会想到神马呢. 逝者如斯夫,不舍昼夜. 如果你继续在终端里输入ne

JavaScript中各种引用类型的常用操作方法小结_基础知识

Object类型 Array类型重排序方法: compare升序: function compare(value1, value2){ if (value1<value2){ return -1; } if (value1>value2){ return 1; } else{ return 0; } } var values = [0,1,5,10,15]; values.sort(compare); console.log(values); // [0,1,5,10,15] 降序: func