javascript getElementById 使用方法及用法_javascript技巧

document.getElementById("link").href;
document.getElementById("link").target;
document.getElementById("img").src;
document.getElementById("img").width;
document.getElementById("img").height;
document.getElementById("input").value;
那么如何取得

以及之间的值呢？如

aaa

中的aaa，bbb中的bbb，也很简单，利用innerHTML就可以了：
document.getElementById("div").innerHTML;
document.getElementById("link").innerHTML;
getElementById 方法
返回具有指定 ID 属性值的第一个对象的一个引用。
语法
oElement = document.getElementById(sIDValue)
参数
sIDValue 必选项。指明 ID 属性值的字符串
返回值
返回 ID 属性值与指定值相同的第一个对象。
注释
如果 ID 属于一个集合，getElementById 方法返回集合中的第一个对象。
getElementById 方法与使用 all 集合上的 item 方法等同。例如，以下代码样本表示如何从 document 对象中取回 ID 为 oDiv 的第一个要素。
使用 DHTML 对象模型：
var oVDiv = document.body.all.item("oDiv");
使用文档对象模型(DOM)：
var oVDiv = document.getElementById("oDiv");
示例
以下例子表示如何使用 getElementById 方法返回 ID 属性值 oDiv 的第一次出现。
<script> <BR>function fnGetId(){ <BR>// Returns the first DIV element in the collection. <BR>var oVDiv=document.getElementById("oDiv1"); <BR>} <BR></script>

Div #1

Div #2

Div #3

getElementById 方法
返回具有指定 ID 属性值的第一个比如说有个网页中有个text框的id叫text1
getElementById(text1)就能得到这个text1框的对象,并使用text框的所有属性和方法
这个是JS的一个方法，意思是通过控件ID取得元素的值，如一个form里包函text、label等，他们都是FORM的元素，有一个分配的ID，getElementById()是取得这些元素的text值的。
这个是JS的一个方法，意思是通过控件ID取得元素的值，如一个form里包函text、label等，他们都是FORM的元素，有一个分配的ID，getElementById()是取得这些元素的text值的。
程序举例 

<script type="text/javascript"> function alignRow() { var x=document.getElementById('myTable').rows x[0].align="right" } </script> <table width="60%" id="myTable" border="1"> <tr> <td>行1 单元格1</td> <td>行1 单元格2</td> </tr> <tr> <td>行2 单元格1</td> <td>行2 单元格2</td> </tr> <tr> <td>行3 单元格1</td> <td>行3 单元格2</td> </tr> </table> <form> <input type="button" onclick="alignRow()" value="右对齐第一行文字"> </form>
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

支队一个单元隔进行对齐 

<script type="text/javascript"> function alignCell() { var x=document.getElementById('myTable').rows[0].cells x[0].align="center" } </script> <table id="myTable" border="1" width="100%"> <tr> <td>单元格1</td> <td>单元格2</td> </tr> <tr> <td>单元格3</td> <td>单元格4</td> </tr> </table> <form> <input type="button" onclick="alignCell()" value="居中对齐第一个单元格的内容"> </form>
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

改变colspan的值

<script type="text/javascript"> function setColSpan() { var x=document.getElementById('myTable').rows[0].cells x[0].colSpan="2" x[1].colSpan="6" } </script> <table id="myTable" border="1"> <tr> <td colspan="4">单元格1</td> <td colspan="4">单元格2</td> </tr> <tr> <td>单元格3</td> <td>单元格4</td> <td>单元格5</td> <td>单元格6</td> <td>单元格7</td> <td>单元格8</td> <td>单元格9</td> <td>单元格10</td> </tr> </table> <form> <input type="button" onclick="setColSpan()" value="改变colspan值"> </form>
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]