javascript中document.getElementById的常用例子
来源:网络 作者:佚名 点击:
次时间:2017-07-02 09:16
[摘要] 在js中document.getElementById是获取指定ID的然后我们可以针对ID进行相关操作,下面我总结了一些常用的例子。
改变 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>
|
|
------分隔线----------------------------