一、getElementById()

  参数:id 属性,必须唯一。

  返回:元素本身。若 id 不唯一,则返回第一个匹配的元素。

  定义的位置:仅 document(即:除 document 之外的元素调用该方法,会报 is not a function)。

  

二、getElementsByName()

  参数:name 属性,不必唯一。

  返回:NodeList 对象。

  定义的位置:仅 document。

 

三、document.getElementsByTagName()

  参数:1、HTML 元素,不必唯一,不区分大小写。

     2、* , 匹配所有元素。

  返回:HTMLCollection 对象。

  定义的位置:document 和 element(即:可以在任意元素下调用该方法,获取指定元素的后代元素)。

  

四、getElementsByClassName()

  参数:1、字符串参数,不必唯一。

     2、若需多个 className 匹配,使用空格分隔每个 class 。

     3、若文档开头对<!DOCTYPE>声明选择的是‘怪异模式’渲染,则 className 不区分大小写,若选择的是‘严格模式’渲染,则需区分大小写。

  返回:HTMLCollection 对象。

  定义的位置:document 和 element。

  

五、querySelectorAll()

  参数:css 选择器的字符串参数(ID:#、class:.、tag:div、属性:p[name=x]、文档结构:ul>li:first-child、获取多个元素:div, #log)。

  返回:1、返回选择器匹配的所有元素的 NodeList 对象。

     2、没有匹配的元素,返回 空的 NodeList 对象。

     3、选择器字符串非法,抛出异常。

  定义的位置:document 和 element。

  

  彩蛋:JQuery 库中 css 选择器使用了一个与 querySelectorAll() 等效的方法,命名为 $()

六、querySelector()

  参数:css 选择器的字符串参数(ID:#、class:.、tag:div、属性:p[name=x]、文档结构:ul>li:first-child、获取多个元素:div, #log)。

  返回:1、返回选择器匹配的第一个元素本身。

     2、没有匹配的元素,返回 null。

  定义的位置:document 和 element。

  

七、document.Name

  对于 <form>、<img>、<ifram>当且仅当为上述元素设置 name 属性的时候,Window 对象会自动创建一个对应的属性,并可通过 document.name 来获取。

  参数<form>、<img>、<ifram> 标签上的 name 名

  返回:1、若 name 仅匹配上一个元素,则返回元素本身

     2、若匹配上多个元素,则返回 HTMLCollection 对象

  定义的位置:仅 document。

  

七、document.TagName

  对于 <form>、<img>、<a>、<body>、<head>,可通过 document.forms/.images/.links/.body/.head 来获取元素,返回 HTMLCollection 对象。

  参数<form>、<img>、<a>、<body>、<head> 标签名

  返回:1、<form>、<img>、<a>,返回 HTMLCollection 对象,并包含通过 name/id 索引的方法。

     2、<body>、<head>,返回元素本身

  定义的位置:仅 document。

  

Javascript 获取文档元素的更多相关文章

  1. javaScript获取文档中所有元素节点的个数

    HTML+JS 代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...

  2. javascript选取文档元素

    用指定的id属性 用指定的name属性 用指定的标签名字 用指定的CSS类 匹配指定的CSS选择器 通过ID选取元素 var section1 = document.getElementById(&q ...

  3. javascript 获取文档/屏幕的Width||Height

    document.body.clientWidth //网页可见区域宽度document.body.clientHeight //网页可见区域高度document.body.offsetWidth / ...

  4. js、jQuery 获取文档、窗口、元素的各种值

    基于两年开发经验,总结了 javascript.jQuery 获取窗口.文档.元素的各种值 javascript: 文档:是整个document所有的内容 浏览器当前窗口文档body的宽度: docu ...

  5. JavaScript中的window对象的属性和方法;JavaScript中如何选取文档元素

    一.window对象的属性和方法 ①setTimeout()方法用来实现一个函数在指定毫秒之后运行,该方法返回一个值,这个值可以传递给clearTimeout()用于取消这个函数的执行. ②setIn ...

  6. JavaScipt选取文档元素的方法

    摘自JavaScript权威指南(jQuery根据样式选择器查找元素的终极方式是 先用getElementsByTagName(*)获取所有DOM元素,然后根据样式选择器对所有DOM元素进行筛选) 选 ...

  7. JavaScript : DOM文档解析详解

    JavaScript DOM  文档解析 1.节点(node):来源于网络理论,代表网络中的一个连接点.网络是由节点构成的集合 <p title=“a gentle reminder”> ...

  8. JavaScript获取和创建元素

    1.JavaScript中获取元素 常用的获取document中元素的方法: 1) document.getElementById()  =>通过元素ID获取文档中特定的元素,如获取 id = ...

  9. Javascript - DOM文档对象模型

    文档对象模型(DOM) DOM(Document Object Model,文档对象模型)是一个通过和JavaScript进行内容交互的APIJavascript和DOM一般经常作为一个整体,因为Ja ...

随机推荐

  1. C51学习

    十六个数字循环显示 #include<reg52.h>#include<intrins.h>#define uint unsigned int#define uchar uns ...

  2. bootstrap时间格式化

    /** * 将"2018-05-19T08:04:52.000+0000"这种格式的时间转化为正常格式 * @param time */ function timeFormat(t ...

  3. opencv基础教程 之 图像基础和绘图

    1,教程:感谢小强 2,用argparse传参数来显示一张图片 #!/usr/bin/python #linux系统 #coding=utf-8 import cv2 import argparse ...

  4. spring boot 业务场景简单,代码完整的demo们

    源码地址:https://github.com/zhzhair/spring-boot-examples.git 开发环境:windows,jdk8,spring boot2.1.4

  5. java 日常学习记录

    前言:记录自己初学java 遇到的问题. 环境(win10  开始安装的IDEA,net 开发者  )学习网址:http://how2j.cn/stage/14.html (不是打广告) 特别是对初学 ...

  6. mysql登录报错“Access denied for user 'root'@'localhost' (using password: YES”)的处理方法

    环境 CentosOS 6.5 ,已安装mysql 情景 root密码忘记,使用普通用户无法登录 解决 问题一 无法使用mysql命令 参考文章:https://www.cnblogs.com/com ...

  7. gym 102059A 树链剖分后odt维护区间

    题意 一棵树 多次修改,每次修改一个点到根的所有边的颜色,并询问现在有哪些颜色染了恰好$m$条边 题解: 稍加思考可以知道,从某个点到根节点的颜色数,均摊复杂度很低,因此,可以考虑珂朵莉树维护重链剖分 ...

  8. echarts 自定义配置带单位的 tooltip 提示框方法 和 圆环数据 tooltip 过长超出屏幕

    -------tip1-------- 在 tooltip  里边配置:拼接字符串: tooltip : { trigger: 'axis', formatter:function(params) { ...

  9. 逻辑卷管理(linux)

    (创建分区)1.fdisk /dev/sdb2.n3default4.default5.+200M6.w7.partprobe(更新分区)8mkfs.ext4 /dev/sdb1//格式化sdb1.. ...

  10. tp5 修改默认的分页url

    默认分页url:xx.com/xxx?page=1 个人主要感觉不美观,想变成xx.com/xxx/list_1.html这样的 框架本身默认使用的boostrap分页类,目录位置 simplewin ...