JavaScript获取当前页面上的指定对象示例代码


Posted in Javascript onFebruary 28, 2014

JavaScript如何获取当前页面上的指定对象.

方法如下:

document.getElementById(ID) //获得指定ID值的对象 
document.getElementsByName(Name) //获得指定Name值的对象数组 
document.all[] //很智能的东东 不过非WEB标准 
document.getElementsByTagName //获得指定标签值的对象数组

下面给出例子,只需把注释去掉直接运行就可看出效果.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<HTML> 
<HEAD> 
<TITLE> New Document </TITLE> 
<META NAME="Generator" CONTENT="EditPlus"> 
<META NAME="Author" CONTENT=""> 
<META NAME="Keywords" CONTENT=""> 
<META NAME="Description" CONTENT=""> 
</HEAD> <BODY> 
<form method="post" name="mainFrm" action=""> 
<input type="hidden" name="text" id="text" style="width:100%" value="练习而已"> 
<input type="hidden" name="organizationId" style="width:100%" value="验证DOCUMENT.ALL"> 
<table width="100%" border="1"> 
<tr height="22"> 
<td width="15%" align="right">库存组织:</td> 
<td width="20%"><input type="text" name="organizationId" id="organizationId" style="width:100%" value="库存组织"></td> 
</tr> 
<tr> 
<td width="15%" align="right">子库编码:</td> 
<td width="20%"> 
<select name="subinventoryCode" style="width:100%" id="subinventoryCode"> 
<option value="QTWL">QTWL</option> 
<option value="BTSPT">BTSPT</option> 
<option value="BTS">BTS</option> 
</select> 
</td> 
</tr> 
<tr height="22"> 
<td colspan="2" align="center"><input type="button" value="获取指定对象" onclick="do_check()"></td> 
</tr> 
</table> 
</form> 
</BODY> 
</HTML> 
<SCRIPT LANGUAGE="JavaScript"> 
<!-- 
function do_check(){ 
// getElementById:就是通过ID来取得元素,所以只能访问设置了ID的元素。 
// 方法的返回值能确保为你所需要的对象,因为整个页面中一个对象的ID值是唯一的. 
// var organizationId = document.getElementById("organizationId"); 
// alert(organizationId.value); 

// getElementsByName:就是通过NAME来获得元素. 
// 方法的返回值为一个数组,即使在整个页面中只有一个name属性为给定值的对象,它也会以数组的方式返回. 
// 只不过这时的数组长度为一罢了. 
// var organizationId = document.getElementsByName("organizationId"); 
// alert(organizationId[0].value); 
// alert(organizationId.length); 
// getElementsByTagName:通过TAGNAME(标签名称)来获得元素,一个DOCUMENT中当然会有相同的标签, 
// 所以这个方法和getElementsByName基本相识也是取得一个数组,只是获取对象的方式上的区别. 
// var inputs = document.getElementsByTagName("input"); 
// alert(inputs.length); 
// alert(inputs[0].value); 
// alert(inputs[1].value); 
// alert(inputs[2].value); 
// document.all[]是文档中所有标签组成的一个数组变量,包括了文档对象中所有元素. 
// 一般通过名字去获取指定元素,不过它比getElementsByName要智能一点就是如果符合条件的对象有一个则返回此对象,多个会以数组的形式返回 
// var organizationId = document.all["organizationId"]; 
// alert(organizationId[0].value) 
// document.all["organizationId"] 
// document.all.item("organizationId") 
} 
//--> 
</SCRIPT>
Javascript 相关文章推荐
在jQuery1.5中使用deferred对象 着放大镜看Promise
Mar 12 Javascript
解决用jquery load加载页面到div时,不执行页面js的问题
Feb 22 Javascript
JavaScript通过元素的ID和name设置样式
Jul 08 Javascript
理解javascript回调函数
Dec 28 Javascript
JS中的forEach、$.each、map方法推荐
Apr 05 Javascript
react路由配置方式详解
Aug 07 Javascript
微信小程序之滚动视图容器的实现方法
Sep 26 Javascript
JS原生带缩略图的图片切换效果
Oct 10 Javascript
Vue通过for循环随机生成不同的颜色或随机数的实例
Nov 09 Javascript
JavaScript, select标签元素左右移动功能实现
May 14 Javascript
基于vue中的scoped坑点解说
Sep 04 Javascript
jquery实现异步文件上传ajaxfileupload.js
Oct 23 jQuery
jquery获取当前点击对象的value方法
Feb 28 #Javascript
经过绑定元素时会多次触发mouseover和mouseout事件
Feb 28 #Javascript
判断某个字符在一个字符串中是否存在的js代码
Feb 28 #Javascript
如何设置一定时间内只能发送一次请求
Feb 28 #Javascript
js中settimeout方法加参数
Feb 28 #Javascript
js校验表单后提交表单的三种方法总结
Feb 28 #Javascript
js对象转json数组的简单实现案例
Feb 28 #Javascript
You might like
解析thinkphp中的导入文件标签
2013/06/20 PHP
PHP模板引擎Smarty自定义变量调解器用法
2016/04/11 PHP
基于jQuery的图片大小自动适应实现代码
2010/11/17 Javascript
基于jquery的弹出提示框始终处于窗口的居中位置(类似于alert弹出框的效果)
2011/09/28 Javascript
js实现连续英文字符自动换行兼容ie6 ie7和firefox
2013/09/06 Javascript
jQuery中delegate()方法用法实例
2015/01/19 Javascript
手机端 HTML5使用photoswipe.js仿微信朋友圈图片放大效果
2016/08/25 Javascript
JavaScript基于对象去除数组重复项的方法
2016/10/09 Javascript
jquery——九宫格大转盘抽奖实例
2017/01/16 Javascript
Nuxt项目支持eslint+pritter+typescript的实现
2019/05/20 Javascript
浅谈vuex中store的命名空间
2019/11/08 Javascript
微信sdk实现禁止微信分享(使用原生php实现)
2019/11/15 Javascript
js+canvas实现五子棋小游戏
2020/08/02 Javascript
[01:05:52]DOTA2-DPC中国联赛 正赛 Ehome vs Aster BO3 第一场 2月2日
2021/03/11 DOTA
python生成器generator用法实例分析
2015/06/04 Python
Python简单连接MongoDB数据库的方法
2016/03/15 Python
CentOS 7下Python 2.7升级至Python3.6.1的实战教程
2017/07/06 Python
Python 基础教程之闭包的使用方法
2017/09/29 Python
深入理解Django的自定义过滤器
2017/10/17 Python
Python实现PS图像调整颜色梯度效果示例
2018/01/25 Python
使用python的turtle绘画滑稽脸实例
2019/11/21 Python
Canvas高级路径操作之拖拽对象的实现
2019/08/05 HTML / CSS
HTML5 canvas实现的静态循环滚动播放弹幕
2021/01/05 HTML / CSS
优衣库澳大利亚官网:UNIQLO澳大利亚
2017/01/18 全球购物
施华洛世奇水晶荷兰官方网站:SWAROVSKI荷兰
2017/05/12 全球购物
梅西百货澳大利亚:Macy’s Australia
2017/07/26 全球购物
美国最佳在线航班预订网站:LookupFare
2019/03/26 全球购物
施华洛世奇巴西官网:SWAROVSKI巴西
2019/12/03 全球购物
NICKIS.com荷兰:设计师儿童时装
2020/01/08 全球购物
党员志愿者活动总结
2014/06/26 职场文书
学校领导干部民主生活会整改方案
2014/09/29 职场文书
先进学校事迹材料
2014/12/30 职场文书
升学宴答谢词
2015/01/05 职场文书
自我检讨报告
2015/01/28 职场文书
导游词之新疆-喀纳斯
2019/10/10 职场文书
python库Tsmoothie模块数据平滑化异常点抓取
2022/06/10 Python