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 相关文章推荐
用javascript实现读取txt文档的脚本
Jul 20 Javascript
JavaScript 异步调用框架 (Part 5 - 链式实现)
Aug 04 Javascript
基于jquery ajax 用户无刷新登录方法详解
Apr 28 Javascript
jquery js 重置表单 reset()具体实现代码
Aug 05 Javascript
解决checkbox的attr(checked)一直为undefined问题
Jun 16 Javascript
使用JQ来编写最基本的淡入淡出效果附演示动画
Oct 31 Javascript
javascript 显示全局变量与隐式全局变量的区别
Feb 09 Javascript
Node.JS中事件轮询(Event Loop)的解析
Feb 25 Javascript
微信小程序中页面FOR循环和嵌套循环
Jun 21 Javascript
vue watch自动检测数据变化实时渲染的方法
Jan 16 Javascript
深入浅析Vue全局组件与局部组件的区别
Jun 15 Javascript
微信小程序开发(三):返回上一级页面并刷新操作示例【页面栈】
Jun 01 Javascript
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
如何使用php绘制在图片上的正余弦曲线
2013/06/08 PHP
PHP代码优化的53个细节
2014/03/03 PHP
Windows下的PHP 5.3.x安装 Zend Guard Loader教程
2014/09/06 PHP
PHP中常用的输出函数总结
2014/09/22 PHP
php实现mysql数据库分表分段备份
2015/06/18 PHP
WordPress主题中添加文章列表页页码导航的PHP代码实例
2015/12/22 PHP
Yii使用技巧大汇总
2015/12/29 PHP
php 静态属性和静态方法区别详解
2017/04/09 PHP
基于jQuery图片平滑连续滚动插件
2009/04/27 Javascript
分享一则JavaScript滚动条插件源码
2015/03/03 Javascript
js实现顶部可折叠的菜单工具栏效果实例
2015/05/09 Javascript
weex里Vuex state使用storage持久化详解
2017/09/09 Javascript
Vue高版本中一些新特性的使用详解
2018/09/25 Javascript
vue-cli3.0+element-ui上传组件el-upload的使用
2018/12/03 Javascript
「中高级前端面试」JavaScript手写代码无敌秘籍(推荐)
2019/04/08 Javascript
详解VUE中的插值( Interpolation)语法
2020/10/18 Javascript
node.js如何根据URL返回指定的图片详解
2020/10/21 Javascript
在react-antd中弹出层form内容传递给父组件的操作
2020/10/24 Javascript
Vue实现手机号、验证码登录(60s禁用倒计时)
2020/12/19 Vue.js
跟老齐学Python之Python文档
2014/10/10 Python
python使用TensorFlow进行图像处理的方法
2018/02/28 Python
Python按钮的响应事件详解
2019/03/04 Python
matplotlib命令与格式之tick坐标轴日期格式(设置日期主副刻度)
2019/08/06 Python
python 实现简单的FTP程序
2019/12/27 Python
浅析Python3 pip换源问题
2020/01/06 Python
Python包,__init__.py功能与用法分析
2020/01/07 Python
Python换行与不换行的输出实例
2020/02/19 Python
python GUI库图形界面开发之PyQt5时间控件QTimer详细使用方法与实例
2020/02/26 Python
Python基于numpy模块实现回归预测
2020/05/14 Python
python正则表达式re.match()匹配多个字符方法的实现
2021/01/27 Python
Giglio德国网上精品店:奢侈品服装和配件
2016/09/23 全球购物
Java语言程序设计测试题选择题部分
2014/04/03 面试题
迅雷Cued工作心得体会
2014/01/27 职场文书
网上卖盒饭创业计划书范文
2014/02/07 职场文书
导师就业推荐信范文
2014/05/22 职场文书
Java生成读取条形码和二维码的简单示例
2021/07/09 Java/Android