特殊元素：

分别获取body和html,全局仅有一个,比较特殊.格式固定,元素名可以自己另外起

var bodyElement=document.body
var htmlElemnt=document.documentElement

老方法(了解即可,咱用HTML5的新方法就行):

根据ID查找元素:

通过ID名查找元素,若没找到则返回null.(顺带提一下,在JavaScript中,null是一个对象,属于历史遗留问题)

var IdElement=document.getElementById('ID名')

根据标签名查找元素:

一般不用这种方法查找,因为标签名太容易重复了,也就body和html有唯一性,但这俩有上面提到的专门的获取方法.

var tagElement=document.getElementByTagName('标签名')

这种或许会更常用一些,通过父节点来获取子元素中的标签元素.

var sonTagElement=element.getElementsByTagName('标签名')

根据类名查找元素:

和上面标签名查找一样,获取的是元素集合,因为共用一个类名(标签)的元素很多.

var classElement=document.getElementByClassNam('类名')

HTML5新增方法:

返回指定选择器所选择的第一个元素对象:

var element=document.querySelector('选择器')

返回指定选择器所选择的元素对象集合:

var elementList=document.querySelectorAll('选择器')

选择器:

和CSS一样.

选择器	标签选择器	类选择器	ID选择器
附加符号	无	.	#

根据节点操作来获取元素:

首先你得先有一个元素。

节点分为三类：1、元素节点（就是元素）2、属性节点3、文本节点（空格、换行……）

由于我们通常只需要元素节点,也就是获取元素,所以下面着重介绍几种常用的获取元素节点的节点操作。

获取父节点：

var fatherElement=element.parentNode

获取子节点:

所有子节点(包含所有节点):

var sonElement=element.childNodes

仅包含元素节点:

var sonElement=element.children

获取第一个元素子节点:

var firstson=element.firstElementChild

获取最后一个元素子节点:

var lastson=element.lastElementChild

例(不懂这样会不会清楚一点点):

<body><div class="father">这个的子节点是son<div class="son"><div class="grandson">这个的父节点是son</div></div></div>
</body>

【JavaScript】获取网页元素相关推荐

用Javascript获取页面元素的位置
制作网页的过程中,你有时候需要知道某个元素在网页上的确切位置. 下面的教程总结了Javascript在网页定位方面的相关知识. 一.网页的大小和浏览器窗口的大小首先,要明确两个基本概念. 一张网页的 ...
html form提交前md5,javascript实现MD5加密-JavaScript获取HTML元素的三种方...-兼容IE与firefox的js回车提交表单_169IT.COM...
本文介绍JavaScript获取网页中HTML元素的三种方法,供大家学习参考. 1.getElementById() getElementById()可以访问DOCUMENT中的某一特定元素,顾名思义 ...
python获取网页元素坐标_html网页元素在屏幕上的坐标获取
今天在用python调用IE获取html网页元素在屏幕上的坐标,当然为了截图啦,(*^__^*) 嘻嘻-- xtop=ie.document.forms[i].elements[j].getBound ...
JavaScript 获取一元素的所有子元素
JavaScript 获取一元素的所有子元素现有一表格,代码如下: < table border =1 cellpadding =0 cellspacing =0 width =300 ...
Qt利用JavaScript访问网页元素(百度博客下载例子)
Qt利用JavaScript访问网页元素(百度博客下载例子) 本站所有文章由本站和原作者保留一切权力,仅在保留本版权信息.原文链接.原文作者的情况下允许转载,转载请勿删改原文内容, 并不得用于商业 ...
C# webbrowser 获取网页元素示例代码
在应用webbrowser对网页进行自动化操作时,不能有效地获取网页元素,往往是后续编程的拦路虎,原因是webbrowser提供的GetElementById().GetElementFromPoin ...
javascript获取网页URL地址及参数等
2019独角兽企业重金招聘Python工程师标准>>> 用javascript获取url网址信息 Java代码 <script type="text/javascri ...
JavaScript实现网页元素的拖拽效果
以下的页面中放了两个div,能够通过鼠标拖拽这两个元素到任何位置. 实现该效果的HTML页面代码例如以下所看到的: <!DOCTYPE html> <html> <hea ...
快速获取网页元素xpath的方法
准备工具: chrome浏览器步骤一:在chrome上打开自己想要获取元素的xpath的网页例如,打开百度首页如下: 我的有点花哨,哈哈!!! 步骤二:按下F12,打开控制台步骤三:选中自己想要 ...

【JavaScript】获取网页元素