JavaScript Dom 查找

一、直接查找

  1. 获取单个元素 document.getElementById('i1')
  2. 获取多个元素(列表数组) document.getElementsByTagName('div')
  3. 获取多个元素(列表数组) document.getElementsByClassName('c1')

  • // 根据ID获取一个标签
  • document.getElementById

  • // 根据name属性获取标签集合
  • document.getElementsByName

  • // 根据class属性获取标签集合
  • document.getElementsByClassName

  • // 根据标签名获取标签集合
  • document.getElementsByTagName

二、间接查找

  1. 指定单个元素 tag = document.getElementById('i1')
  2. 查找该元素父级标签 = tag.parentElenment

  • // 父节点
  • parentNode    

  • // 所有子节点      
  • childNodes      

  • // 第一个子节点    
  • firstChild     

  • // 最后一个子节点     
  • lastChild    

  • // 下一个兄弟节点       
  • nextSibling         

  • // 上一个兄弟节点
  • previousSibling     

  • // 父节点标签元素 
  • parentElement   

  • // 所有子标签        
  • children       

  • // 第一个子标签元素         
  • firstElementChild    

  • // 最后一个子标签元素   
  • lastElementChild        

  • // 下一个兄弟标签元素
  • nextElementtSibling    

  • // 上一个兄弟标签元素 
  • previousElementSibling  

JavaScript Dom 查找的更多相关文章

  1. JavaScript, DOM查找元素

    1.document.getElementById("id"); => IE8 及较低版本不区分ID的大小写 => IE7及较低版本中表单元素的name特性和ID都会被 ...

  2. JavaScript Dom基础-9-Dom查找方法; 设置DOM元素的样式; innerHTML属性的应用; className属性的应用; DOM元素上添加删除获取属性;

    JavaScript Dom基础 学习目标 1.掌握基本的Dom查找方法 domcument.getElementById() Domcument.getElementBy TagName() 2.掌 ...

  3. 读书笔记:JavaScript DOM 编程艺术(第二版)

    读完还是能学到很多的基础知识,这里记录下,方便回顾与及时查阅. 内容也有自己的一些补充. JavaScript DOM 编程艺术(第二版) 1.JavaScript简史 JavaScript由Nets ...

  4. javaScript DOM JQuery AJAX

    http://www.cnblogs.com/wupeiqi/articles/5369773.html 一 JavaScript JavaScript是一门编程语言,浏览器内置了JavaScript ...

  5. HTML,javaScript,DOM详解

    HTML DOM 教程 DOM 教程 DOM 简介 HTML DOM 定义了访问和操作 HTML 文档的标准方法. DOM 将 HTML 文档表达为树结构. HTML DOM 树 HTML DOM 简 ...

  6. JavaScript DOM编程艺术学习笔记(一)

    嗯,经过了一周的时间,今天终于将<JavaScript DOM编程艺术(第2版)>这本书看完了,感觉受益匪浅,我和作者及出版社等等都不认识,无意为他们做广告,不过本书确实值得一看,也值得推 ...

  7. Python 15 html 基础 - CSS &javascript &DOM

    本节内容 CSS基础 javascript基础 DOM 前言,这边这块楼主已经很熟悉了,CSS天天用到,简单的一些javascript也是所以就挑点重点说了.然后就是dom不怎么用,但是其实也用不到, ...

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

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

  9. 《JavaScript Dom 编程艺术》读书笔记-第4章

    我的前端入门第一本书是<JavaScript Dom 编程艺术>,网上查找资料发现前端的入门推荐书籍最受好评的就是这本和<JavaScript 高级程序设计>了.之所以先选这本 ...

随机推荐

  1. <转>从K近邻算法、距离度量谈到KD树、SIFT+BBF算法

    转自 http://blog.csdn.net/likika2012/article/details/39619687 前两日,在微博上说:“到今天为止,我至少亏欠了3篇文章待写:1.KD树:2.神经 ...

  2. D - Windows Message Queue

    来源hdu1509 Message queue is the basic fundamental of windows system. For each process, the system mai ...

  3. Solve Error: Unhandled exception at 0x00905a4d in xxx.exe: 0xC0000005: Access violation.

    在使用Visual Studio进行项目开发的时候,有时候会遇到下面这个错误: Unhandled exception at 0x00905a4d in xxx.exe: 0xC0000005: Ac ...

  4. Retrofit2 项目配置

    在项目的 app  build.gradle 文件中加入 dependencies { // Retrofit2implementation 'com.squareup.retrofit2:retro ...

  5. phpcms栏目标签调用

    $CATEGORY[$catid][catid]                栏目id   $CATEGORY[$catid][module]                栏目所在的模块   $C ...

  6. 补充:javascript

    写法分类:1.行内(内联)写在标签里面,以属性的形式表现,属性名是事件属性名例如:<button onClick="js代码"></button>2.内嵌写 ...

  7. 如果报错,使用 journalctl -f -t etcd 和 journalctl -u etcd 来定位问题。

    如果报错,使用 journalctl -f -t etcd 和 journalctl -u etcd 来定位问题.

  8. C++/C面试题(2)

    (1)单向链表操作  1)在链表尾部插入一个节点 void addNewNodeTail(ListNode **HeadNode, int value)//在链表尾部插入一个节点{ ListNode* ...

  9. Codeforces 1090D - Similar Arrays - [思维题][构造题][2018-2019 Russia Open High School Programming Contest Problem D]

    题目链接:https://codeforces.com/contest/1090/problem/D Vasya had an array of n integers, each element of ...

  10. vue 点击弹窗外框关闭弹框

    https://blog.csdn.net/zjw0742/article/details/77822777 ready() { document.addEventListener('click', ...