原生写一个一键获取所有DOM元素的方法
一天挺一个朋友去面试要做一个获取dom元素到数组中
主要用到一个递归算法,通过节点的childNodes属性--代码如下:
function getAllNode() {
var nodes = document.childNodes;
var arr_all_ele = [];
function returnNode(arr_nodes, arr_all_ele) {
for(var i=0; i<arr_nodes.length; i++) {
var parentNode = arr_nodes[i];
arr_all_ele.push(parentNode);
var childNodes = parentNode.childNodes;
if(childNodes.length != 0) {
returnNode(childNodes, arr_all_ele);
}
}
}
returnNode(document.childNodes, arr_all_ele);
return arr_all_ele;
}
返回结果是所有dom到一个数组中:
![](https://images2018.cnblogs.com/blog/1244681/201807/1244681-20180726090031658-2049325683.png)
原生写一个一键获取所有DOM元素的方法的更多相关文章
- JS获取HTML DOM元素的方法
JS获取HTML DOM元素有八种方法: 1.根据id获取标签元素: document.getElementById("id名"); 2.根据标签名获取标签列表: document ...
- 原生JS获取HTML DOM元素的8种方法
JS获取DOM元素的方法(8种) 通过ID获取(getElementById) 通过name属性(getElementsByName) 通过标签名(getElementsByTagName) 通过类名 ...
- JS获取HTML DOM元素的8种方法
什么是HTML DOM 文档对象模型(Document Object Model),是W3C组织推荐的处理可扩展置标语言的标准编程接口.简单理解就是HTML DOM 是关于如何获取.修改.添加或删除 ...
- Jquery 方式获取 iframe Dom元素
Jquery 方式获取 iframe Dom元素 測试页面代码: <html> <head> <title>jquery方式,訪问iframe页面dom元素& ...
- JS----获取DOM元素的方法(8种)
什么是HTML DOM 文档对象模型(Document Object Model),是W3C组织推荐的处理可扩展置标语言的标准编程接口.简单理解就是HTML DOM 是关于如何获取.修改.添加或删除 ...
- JS选取DOM元素的方法
摘自JavaScript权威指南(jQuery根据样式选择器查找元素的终极方式是 先用getElementsByTagName(*)获取所有DOM元素,然后根据样式选择器对所有DOM元素进行筛选) 今 ...
- JS添加或删除HTML dom元素的方法实例分析
本文实例讲述了JS代码添加或删除HTML dom元素的方法.分享给大家供大家参考,具体如下: 创建新的 HTML 元素 如需向 HTML DOM 添加新元素,您必须首先创建该元素(元素节点),然后向一 ...
- 关于jq的load不用回调获取其中dom元素方法
jq的load方法如果要操作其中的dom元素,需要使用回调,等其加载完了再进行dom元素的获取,今天看我们项目组长写的一段代码,发现不用回调也能获取到其中的元素. 具体是这样写的: <scrip ...
- 获取或操作DOM元素特性的几种方式
1. 通过元素的属性 可以直接通过元素属性获取或操作特性,但是只有公认的特性(非自定义的特性),例如id.title.style.align.className等,注意,因为在ECMAScript中, ...
随机推荐
- python类与对象练习题扑克牌
#定义一个扑克类,属性是颜色,数字.#定义一个手类,属性是扑克牌得颜色数字#定义一个人类,属性是左手,右手.类里定义一些方法,比如交换,展示 class Poker : def __init__(se ...
- tp5怎么验证手机号码
直接上干货
- Python异或加密字符串
import os import sys import struct def enc(path, key): path_ret = "" for i in range(0, len ...
- 有根树的表达 Aizu - ALDS1_7_A: Rooted Trees
有根树的表达 题目:Rooted Trees Aizu - ALDS1_7_A A graph G = (V, E) is a data structure where V is a finite ...
- golang的数据类型之基本数据类型的默认值和转换
默认值: 整型的默认值:0 浮点型的默认值:0字符串的默认值:"" //空布尔类型的默认值:false package mainimport "fmt" f ...
- python第一个问题
temp=input("请输入1到100之间内的数字:")if num > 50: print("你妹好漂亮")else: print(&qu ...
- poj2752Seek the Name, Seek the Fame(next数组)
题目传送门 Seek the Name, Seek the Fame Time Limit: 2000MS Memory Limit: 65536K Total Submissions: 2439 ...
- Git 关于Fast Forward提交的简单说明
多人协同开发,使用Git经常会看到警告信息包含术语:fast forward, 这是何义? 简单来说就是提交到远程中心仓库的代码必须是按照时间顺序的. 比如A从中心仓库拿到代码后,对文件f进行了修改. ...
- Java开发中的23种设计模式详解(3)行为型
本章是关于设计模式的最后一讲,会讲到第三种设计模式--行为型模式,共11种:策略模式.模板方法模式.观察者模式.迭代子模式.责任链模式.命令模式.备忘录模式.状态模式.访问者模式.中介者模式.解释器模 ...
- hashRouter and BrowserRouter
<html><body> <div> <button class="btn" onclick="btnFun();"& ...