1 - 直接查找标签

// 方式1:获取元素
document.getElementsByTagName("标签名") document.getElementById("id值") document.getElementsByClassName("类名")


// 方式2:css选择器:
document.querySelector("css选择器") // 根据css选择符来获取查找到的第一个元素,返回标签对象(dom对象)
document.querySelectorAll("css选择器"); // 根据css选择符来获取查找到的所有元素,返回数组

2 - 导航查找标签

elementNode.parentElement           // 父节点标签元素

elementNode.children                // 所有子标签

elementNode.firstElementChild       // 第一个子标签元素

elementNode.lastElementChild        // 最后一个子标签元素

elementNode.nextElementtSibling     // 下一个兄弟标签元素

elementNode.previousElementSibling  // 上一个兄弟标签元素

JS_DOM操作之查找标签的更多相关文章

  1. 6、前端--DOM操作(查找标签、节点操作、获取值操作、class操作、样式操作、绑定事件、内置参数this)

    DOM操作之查找标签 前缀关键字>>>:document # 基本查找(核心) document.getElementById 根据ID获取一个标签 document.getElem ...

  2. Dom,查找标签和操作标签

    Dom,查找标签和操作标签 文档对象模型(Document Object Model,DOM)是一种用于HTML和XML文档的编程接口.它给文档提供了一种结构化的表示方法,可以改变文档的内容和呈现方式 ...

  3. JS BOM DOM对象 select联动 计时器 时间 css操作 节点(标签 ) 查找标签 {前端基础之BOM和DOM}

    前端基础之BOM和DOM 前戏 到目前为止,我们已经学过了JavaScript的一些简单的语法.但是这些简单的语法,并没有和浏览器有任何交互. 也就是我们还不能制作一些我们经常看到的网页的一些交互,我 ...

  4. DOM对象之查找标签&属性操作

    HTML DOM (文档对象模型) DOM(Document Object Model)是一套对文档的内容进行抽象和概念化的方法. JavaScript对DOM进行了实现,对应于JavaScript中 ...

  5. DOM标签操作与事件与jQuery查找标签

    目录 DOM之操作标签 创建标签对象 标签对象的属性 innerText与innerHTML 标签内部追加内容 属性操作 事件 常用事件 事件绑定 事件案例 jQuery简介 查找标签 基本选择器 属 ...

  6. jQuery查找标签--选择器,筛选器,模态对话框, 左侧菜单栏

    查找标签 选择器: 基本选择器(同css) id选择器 $("#id") 标签选择器 $('tagName') class选择器 $(".className") ...

  7. Dom对象总结介绍&事件介绍&增删查找标签

    1.dom有5个属性,属性内容如下 下面开始介绍Dom属性,一共有5个属性 1.document object:文档对象 2.element object:标签对象 3.test object:文本对 ...

  8. selenium常用操作,查找元素,操作Cookie,获取截图,获取窗口信息,切换,执行js代码

    目录: 1. 常用操作 2. 查找元素 3. 操作Cookie 4. 获取截图 5. 获取窗口信息 6. 切换 7. 执行JS代码 简介 selenium.webdriver.remote.webdr ...

  9. js数组操作find查找特定值结合es6特性

    js数组操作find查找特定值结合es6特性

随机推荐

  1. C++调试总结

    一.参考: 本文主要参考<C++编程调试秘笈>一书. 在编写C++代码时,我们不应该自己捕捉缺陷,而是由编译器和可执行代码为我们做这些事情,该书便提供了这样的一个思考.作者以"调 ...

  2. Spring Cloud 专题之六:bus

    书接上回: SpringCloud专题之一:Eureka Spring Cloud专题之二:OpenFeign Spring Cloud专题之三:Hystrix Spring Cloud 专题之四:Z ...

  3. noip模拟34[惨败]

    noip模拟34 solutions 我从来不为失败找借口,因为败了就是败了,没人听你诉说任何事情 今天很伤感,以来考试没考好,二来改题改半天也改不出来 这次算是炸出来了我经常范的一些错误,比如除以0 ...

  4. Java基础——自增自减及初识Math类

    自增自减及初识Math类  public class Demon05 {     public static void main(String[] args) {         // ++ -- 自 ...

  5. appium自动化测试(5)-一些pyhon操作

    1.套件的问题 将所有的测试用例加进去,会一个个执行,用于用例名字没有规范test开头的时候 def suite(): suite = unittest.TestSuite suite.addTest ...

  6. python ui自动化之多窗口切换

    wd.current_window_handle #获取当前窗口句柄 wd.window_handles #获取所有窗口句柄 wd.switch_to.window(wd.window_handles ...

  7. Esxi安装Kali2并开启远程桌面

    Kali安装 登录Vmware Esxi页面,选择"创建/注册虚拟机",步骤和创建其它Linux主机类似(Esxi的安装和介绍可以参考上一篇文章) 不同的地方是,客户机操作系统版本 ...

  8. 使用脚本下载Gmail邮件附件

    以下脚本连接上我的Gmail帐号,将收件箱中2013年1月份的新语丝邮件的附件保存在当前目录的xys文件夹中. import imaplib import email import os dir_na ...

  9. Reuse Sonar Checkstyle Violation Report for Custom Data Analysis

    Write a violation rules file; Import it into Sonar as a Quality Profile named as "MyRules" ...

  10. CAS 5.3服务器搭建

    一.本例环境说明 JDK 1.8 CAS 5.3 apache-maven-3.6.0 二.CAS安装步骤 2.1 提前安装好JDK和Maven环境 安装步骤略 2.2 CAS环境搭建 2.2.1 C ...