js中document通过ID获取的一些使用方法
js中document通过ID获取的一些使用方法
document.getElementById("link").href;
document.getElementById("link").target;
document.getElementById("img").src;
document.getElementById("img").width;
document.getElementById("img").height;
document.getElementById("input").value;
那么如何取得<div></div>以及<a></a>之间的值呢?如<div id="div">aaa</div>中的aaa,<a href="#" id="link">bbb</a>中的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>
function fnGetId(){
// Returns the first DIV element in the collection.
var oVDiv=document.getElementById("oDiv1");
}
</script>
<DIV ID="oDiv1">Div #1</DIV>
<DIV ID="oDiv2">Div #2</DIV>
<DIV ID="oDiv3">Div #3</DIV>
<INPUT TYPE="button" VALUE="Get Names" οnclick="fnGetId()">
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值的。
例子:
<html>
<head>
<script type="text/javascript">
function alignRow()
{
var x=document.getElementById('myTable').rows
x[0].align="right"
}
</script>
</head>
<body>
<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" οnclick="alignRow()" value="右对齐第一行文字">
</form>
</body>
</html>
改变clospan的值
<html>
<head>
<script type="text/javascript">
function setColSpan()
{
var x=document.getElementById('myTable').rows[0].cells
x[0].colSpan="2"
x[1].colSpan="6"
}
</script>
</head>
<body>
<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" οnclick="setColSpan()" value="改变colspan值">
</form>
</body>
</html>
js中document通过ID获取的一些使用方法相关推荐
- js中document.getElementById(ID)与document.getElementsByName(Name)的区别
在一个HTML文档中,每个元素都可以设置ID和NAME属性.其中ID属性是唯一属性,不可以重复,一个ID值只能对应一个元素:而NAME属性是可以重复的,一个NAME值可以对应一组元素. 所以,使用do ...
- js中直接通过id名获取到这个元素
浏览器日常bug: 最近在复习javascript的时候发现了一个我还没有见过的一个有趣的东西,可能你也没有见过,所以就在这里记录一下:就是js中直接通过id名获取到这个元素,且不使用getEleme ...
- html dom createevent,js 中 document.createEvent的用法
js 中 document.createEvent的用法 更新时间:2010年08月29日 23:22:02 作者: 用该方法创建了 Event 对象以后,必须用上表中所示的初始化方法初始化对象. ...
- js 中 document.createEvent的用法-转载
js 中 document.createEvent的用法 <a class="comment-mod" οnclick="alert('ss')" hre ...
- js中hover事件时候的BUG以及解决方法
js中hover事件时候的BUG以及解决方法 参考文章: (1)js中hover事件时候的BUG以及解决方法 (2)https://www.cnblogs.com/mmykdbc/p/7464050. ...
- nuxt.js中的静态图片显示不出来解决方法
nuxt.js中的静态图片显示不出来解决方法 <script> export default {data() {return {imgList: [{ name: "图1&quo ...
- java getbean方法_java相关:spring中通过ApplicationContext getBean获取注入对象的方法实例...
java相关:spring中通过ApplicationContext getBean获取注入对象的方法实例 发布于 2020-12-19| 复制链接 分享一篇关于关于spring中通过Applicat ...
- js中根据元素名获取对象,根据id获取等等。。。
获取: //根据ID获取var aa = document.getElementById('bo')://根据元素名获取 返回一个集合var bb = document.getElementsByTa ...
- js中document里的常用函数
js里要得到html中的元素,可以通过document里的函数获得.这样获得了html中的元素就可以方便的进行后续操作.获得html中的元素有三种方式,分别是通过id,name和tagname,其中h ...
最新文章
- JSONP 跨域的原理
- 认识CentOS下boot目录和el5、el6文件
- python关键字是什么颜色,python – Matplotlib:如果使用关键字sym,则使用Boxplot异常值颜色更改...
- MySQL根被拒绝_[转载]phpMyAdmin 尝试连接到 MySQL 服务器,但服务器拒绝连接。...
- 【Tools】VMware虚拟机三种网络模式详解和操作
- 8086汇编_除法指令
- Spring Batch @EnableBatchIntegration 注解
- 合成艺术字二 :使用的透明类以及所用的颜色选择器JS(完整事列源码)
- 【简单几句】应对焦虑
- Apache+php 在windows下的配置
- kafka偏移量保存到mysql里_用java代码手动控制kafkaconsumer偏移量
- [3rgb.com开发笔记] 初步设想篇
- Java虚拟机类加载机制--类加载的过程详解
- Marvelous Designer 服装设计与模拟
- MFC Windows程序设计源代码免费下载
- 从Q_Learning看强化学习
- 性能优化:空间换时间
- dve 二维数组信号 显示波形_VCS-DVE
- 关于监控服务器指标、CPU、内存、警报的一些解决方案
- Node.js+Vue.js全栈开发王者荣耀手机端官网和管理后台(一)