javascript引用对象的方法


Posted in Javascript onJanuary 11, 2007

<a id="link1" name="link1" href="http://bbs.51js.com/">51js</a>

=============
同一页面内的引用方法:

1、使用id:

link1.href

2、使用name:

document.all.link1.href

3、使用sourseIndex:

document.all(4).href //注意,前面还有HTML、HEAD、TITLE和BODY,所以是4

4、使用链接集合:

document.anchors(0).href //全部的集合有all、anchors、applets、areas、attributes、behaviorUrns、bookmarks、boundElements、cells、childNodes、children、controlRange、elements、embeds、filters、forms、frames、images、imports、links、mimeTypes、options、plugins、rows、rules、scripts、styleSheets、tBodies、TextRectangle,请参考MSDN介绍。其实方法3和方法4是一样使用的集合,只是一个是all,可以包括页面所有标记,而anchors只包括链接。

5、getElementById:

document.getElementById("link1").href

6、getElementsByName:

document.getElementsByName("link1")[0].href //这也是一个集合,是所有name等于该方法所带参数的标记的集合

7、getElementsByTagName:

document.getElementsByTagName("A")[0].href //这也是一个集合,是所有标记名称等于该方法所带参数的标记的集合

8、tags集合:

document.all.tags("A")[0].href //与方法7一样是按标记名称取得一个集合

除此之外,event.scrElement可以获得触发时间的标记的引用;document.elementFromPoint(x,y)可以获得x和y坐标处的元素的引用;document.body.componentFromPoint(event.clientX,event.clientY)可以获得鼠标所在处元素的引用;还可以通过元素的父子节点和兄弟节点关系来引用,如nextSibling(当前节点的后一节点)、previousSibling(当前节点的前一节点)、childNodes、children、firstChild、lastChild、parentElement等都是父子节点和兄弟节点的一些引用;还不仅限于此。

上面是同一页面内的常见引用方法,另外还涉及到不同页面中的

=============
对于分帧的页面,可以使用parent.frames("帧的name")、top.frames("帧的name")来引用不同的帧,后面的引用和同一页面内市相同的,多重的parent也是支持的。
例如:
parent.frames("frame1").document.all.link1
top.frames("frame1").document.all.link1

=============
对于window.open()开的窗口,可以使用var newwin=window.open(),然后使用newwin来引用新窗口,后面的引用和同一页面内是相同的;新窗口可以使用window.opener来引用打开它的窗口,可以简写作opener,例如:
var newwin=window.open()
父窗口(这里是使用window.open()方法的窗口):
newwin.document.all.link1 //父窗口这句可引用新窗口中的对象
子窗口(window.open()方法打开的窗口):
opener.document.all.link1 //子窗口这句可引用父窗口的对象

多重opener也是支持的,例如:opener.opener.document.all.link1 

方法多种多样,有时候需要根据具体的情况而定,灵活运用才可以游刃有余。

Javascript 相关文章推荐
多种方法实现load加载完成后把图片一次性显示出来
Feb 19 Javascript
Node.js的文件权限及读写flag详解
Oct 11 Javascript
Jquery+Ajax+xml实现中国地区选择三级联动菜单效果(推荐)
Jun 09 jQuery
利用jQuery+localStorage实现一个简易的计时器示例代码
Dec 25 jQuery
基于vue,vue-router, vuex及addRoutes进行权限控制问题
May 02 Javascript
Node.js使用cookie保持登录的方法
May 11 Javascript
Vue.js 中的 v-model 指令及绑定表单元素的方法
Dec 03 Javascript
JavaScript实现的九种排序算法
Mar 04 Javascript
ligerUI的ligerDialog关闭刷新的方法
Sep 27 Javascript
使用kbone解决Vue项目同时支持小程序问题
Nov 08 Javascript
Vue解析剪切板图片并实现发送功能
Feb 04 Javascript
详解vue v-model
Aug 31 Javascript
一份老外写的XMLHttpRequest代码多浏览器支持兼容性
Jan 11 #Javascript
javascript基础的动画教程,直观易懂
Jan 10 #Javascript
JS宝典学习笔记(下)
Jan 10 #Javascript
js宝典学习笔记(上)
Jan 10 #Javascript
javascript编程起步(第七课)
Jan 10 #Javascript
javascript编程起步(第六课)
Jan 10 #Javascript
javascript编程起步(第五课)
Jan 10 #Javascript
You might like
swfupload 多文件上传实现代码
2008/08/27 PHP
国外十大最流行的PHP框架排名
2013/07/04 PHP
php求正负数数组中连续元素最大值示例
2014/04/11 PHP
php服务器的系统详解
2019/10/12 PHP
理解JavaScript中的对象 推荐
2011/01/09 Javascript
javascript 延迟加载技术(lazyload)简单实现
2011/01/17 Javascript
Jquery的hide及toggle方法让超链接慢慢消失
2013/09/06 Javascript
鼠标移入移出事件改变图片的分辨率的两种方法
2013/12/17 Javascript
JS实现点击链接取消跳转效果的方法
2014/01/24 Javascript
js正则表达式中test,exec,match方法的区别说明
2014/01/29 Javascript
Javascript Memoizer浅析
2014/10/16 Javascript
jQuery实现二级下拉菜单效果
2016/01/05 Javascript
详解Bootstrap插件
2016/04/25 Javascript
jquery easyui DataGrid简单示例
2017/01/23 Javascript
基于Angular.js实现的触摸滑动动画实例代码
2017/02/19 Javascript
JavaScript通过改变文字透明度实现的文字闪烁效果实例
2017/04/27 Javascript
react 兄弟组件如何调用对方的方法示例
2018/10/23 Javascript
微信小程序实现顶部下拉菜单栏
2018/11/04 Javascript
利用vue-i18n实现多语言切换效果的方法
2019/06/19 Javascript
Node.js实现简单的爬取的示例代码
2019/06/25 Javascript
JavaScript实现文件下载并重命名代码实例
2019/12/12 Javascript
Vue中this.$nextTick的作用及用法
2020/02/04 Javascript
JavaScript canvas实现跟随鼠标事件
2020/02/10 Javascript
vue中 v-for循环的用法详解
2020/02/19 Javascript
[01:42]辉夜杯战队访谈宣传片—FANTUAN
2015/12/25 DOTA
在MAC上搭建python数据分析开发环境
2016/01/26 Python
Python3 循环语句(for、while、break、range等)
2017/11/20 Python
Python实现分段线性插值
2018/12/17 Python
python sklearn库实现简单逻辑回归的实例代码
2019/07/01 Python
解决安装pyqt5之后无法打开spyder的问题
2019/12/13 Python
Python图像阈值化处理及算法比对实例解析
2020/06/19 Python
CSS3 input框的实现代码类似Google登录的动画效果
2020/08/04 HTML / CSS
高等教育学自荐书范文
2014/02/10 职场文书
好好学习保证书
2015/02/26 职场文书
会计工作能力自我评价
2015/03/05 职场文书
el-form每行显示两列底部按钮居中效果的实现
2022/08/05 HTML / CSS