`

Javascript 获取DOM对象

 
阅读更多
Javascript 通过以下三种方式获取DOM对象

方法1：
var div= document.getElementsByTagName('div');
var a =document.getElementsByName('age');
var b =document.getElementById('sex');

方法2： 
<html>
<head>
</head>
<body>
<form name="form1"><input type="text" name="username" value="Peter"></form>
<form name="form2"><input type="text" name="username" value="Tom"></form>
<form name="form3"><input type="text" name="username" value="Mike"></form>

<script>
	document.write(document.form2.username.value+'<br>');
	document.write(document['form2'].username.value+'<br>');
	document.write(document.forms['form2'].username.value+'<br>');
	document.write(document.forms[1].username.value+'<br>');
	document.write(document.forms.item(1).username.value+'<br>');
	document.write(document.forms.item('form2').username.value+'<br>');
	document.write(document.forms.form2.username.value+'<br>');
	
	//output all elements
	for(var item in document)
		document.write('document.'+item+' = '+document[item] + '<br>');

</script>
</body>
</html>
分享到：
| Javascript 实例-- 滑动菜单
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    JavaScript操作DOM对象 Day05

    JavaScript操作DOM对象 0 核心 浏览器网页就是一个Dom树形结构！ 获取Dom节点：得到Dom节点 更新：更新Dom节点 添加：添加一个新的节点 删除：删除一个Dom节点 要操作一个Dom节点，就必须要先获得这个Dom节点。 1 ...

    JavaScript DOM编程艺术(中文第2版)

    2.7.1 内建对象 2.7.2 宿主对象 2.8 小结 第3章 DOM 3.1 文档:DOM中的"D" 3.2 对象:DOM中的"O" 3.3 模型:DOM中的"M" 3.4 节点 3.4.1 元素节点 3.4.2 文本节点 3.4.3 属性节点 3.4.4 CSS 3.4.5 获取元素 3.4.6 盘点...

    JavaScript实现DOM对象选择器

    ①可以通过id获取DOM对象，例如 $(“#adom”);  ②可以通过tagName获取DOM对象，例如 $(“a”);  ③可以通过样式名称获取DOM对象，例如 $(“.classa”);  ④可以通过attribute匹配获取DOM对象，例如 $(“[data-...

    【JavaScript源代码】JavaScript中BOM和DOM详解.docx

    DOM对象 Document文档对象 element文档对象 DOM事件操作 鼠标事件 键盘事件 触屏事件 特殊事件 表单事件 浏览器兼容处理 兼容性写法，封装工具 　BOM（浏览器对象模型） 　1. window 获取浏览器c窗口尺寸 2

    JavaScript实现获取dom中class的方法

    本文实例讲述了JavaScript实现获取dom中class的方法。分享给大家供大家参考。具体实现方法如下： &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head lang="en"&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;&lt;/...

    JavaScript程序设计——DOM访问实验报告.docx

    问：如何使用HTML DOM getElementsByTagName() 方法获取文档中所有的表： 答： Var tables = document.getElementsByTagName("table"); alert("This document contains contains"+tables.length+"tables");

    JavaScript Dom 绑定事件操作实例详解

    // 先获取Dom对象，然后进行绑定 document.getElementById('xx').onclick document.getElementById('xx').onfocus // 谁调用这个函数,这个this就指向谁 this：当前出发事件的标签、全局对象 window 一、绑定方式 &...

    JavaScript：DOM编程艺术（第2版）

    《javascript dom编程艺术:第2版》讲述了javascript、dom 和html5 的基础知识，着重介绍dom 编程技术背后的思路和原则：平稳退化、渐进增强和以用户为中心等。这些概念对于任何前端web 开发工作都非常重要。本书将...

    JavaScript实现获取某个元素相邻兄弟节点的prev与next方法

    * @return 返回查找到的元素Dom对象，无则返回null */ function getNearEle(ele, type) { type = type == 1 ? "previousSibling" : "nextSibling"; var nearEle = ele[type]; while(nearEle) {

    Javascript操作dom对象之select全面解析

    　&lt;select id=university&gt; 北京大学&gt;北京大学 ...1.获取select对象； var university=document.getElementById(university); 2.获取select选中option的index值； var index=university.selectedIndex;

    JavaScript学习资料JavaScript基础语法函数及相关源代码资料.zip

    Date对象之获取和设置月份-getMonth&setMonth（教辅）.pdf DOM事件总结（教辅）.pdf DOM事件（ppt）.pdf JavaScripr之while循环（源代码）.zip JavaScript中的循环总结（教辅）.pdf JavaScript之Date对象（源代码）....

    JavaScript与DOM组合动态创建表格实例

    简介　这篇文章简单介绍了DOM 1.0一些基本而强大的方法以及如何在JavaScript中使用它们。你可以学到如何动态地创建、获取、控制和删除HTML元素。这些DOM方法同样适用于XML。所有全面支持DOM 1.0的浏览器都能很好地...

    javascript完全学习手册1 源码

    第6章 DOM对象 122 6.1 DOM概述 122 6.1.1 DOM简介 122 6.1.2 DOM与HTML文档 124 6.2 DOM对象 125 6.2.1 DOM基本接口 125 6.2.2 DOM基本对象 128 6.3 使用DOM 128 6.3.1 DOM基础 129 6.3.2 Node和NodeList接口 131 ...

    详解JS获取HTML DOM元素的8种方法

    文档对象模型（Document Object Model），是W3...JS获取DOM元素的方法（8种） 通过ID获取（getElementById） 通过name属性（getElementsByName） 通过标签名（getElementsByTagName） 通过类名（getElementsByClass

    JavaScript DOM 学习总结(五)

    1、DOM简介。 　当页面加载时，浏览器会创建页面的文档对象模型（Document Object Model）。...2、DOM获取元素。 　JS要想操作HTML元素，那么首先就必须先找到该元素。通常使用以下几种方法完成： 　通过元素设置的id找

    javascript完全学习手册2 源码

    第6章 DoM对象 6．1 DOM概述 6．1．1 DOM简介 6．1．2 DOM与HTML文档 6．2 DOM对象 6．2．1 DOM基本接口 6．2．2 DOM基本对象 6．3 使用DOM 6．3．1 DOM基础 6．3．2 Node和NodeList接口 6．3．3 Element接口 ...

    jQuery第1天：JQ基本介绍、使用步骤、jQuery对象与DOM对象（重点）、jQuery选择器

    jQuery第1天：JQ基本介绍、使用步骤、jQuery对象与DOM对象（重点）、jQuery选择器、mouseover与mouseenter、index方法、区分jQuery与Javascript

    javascript firefox兼容ie的dom方法脚本

    document.all){ //zzcv的ff ie兼容脚本 /*脚本没有解决的问题及处理: 2.IE下,可以使用()或[]获取集合类对象;Firefox下,只能使用[]获取集合类对象. 解决方法:统一使用[]获取集合类对象. 3.IE下,可以使用获取常规...

    JS/jQuery判断DOM节点是否存在的简单方法

    JavaScript原生函数没有提供判断DOM节点是否存在方法，我们通常获取DOM节点几乎都是document.getElement..方法，会返回一个object数组合集，我们可以通过object[0]，object[1]这样来访问这个合集的每一个对象。既然...

    Web应用安全：DOM型XSS.pptx

    DOM型XSS 4 DOM型XSS防御 3 DOM型XSS原理分析 2 DOM型XSS简介 1 DOM 5 反射型与存储型与DOM型的对比 ...dom就是一个树状的模型，你可以编写Javascript代码根据dom一层一层的节点，去遍历/获取/修改对应的节点，对象，

Magicbox
Global site tag (gtag.js) - Google Analytics