一天挺一个朋友去面试要做一个获取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元素的方法的更多相关文章

  1. JS获取HTML DOM元素的方法

    JS获取HTML DOM元素有八种方法: 1.根据id获取标签元素: document.getElementById("id名"); 2.根据标签名获取标签列表: document ...

  2. 原生JS获取HTML DOM元素的8种方法

    JS获取DOM元素的方法(8种) 通过ID获取(getElementById) 通过name属性(getElementsByName) 通过标签名(getElementsByTagName) 通过类名 ...

  3. JS获取HTML DOM元素的8种方法

    什么是HTML DOM 文档对象模型(Document Object Model),是W3C组织推荐的处理可扩展置标语言的标准编程接口.简单理解就是HTML DOM 是关于如何获取.修改.添加或删除 ...

  4. Jquery 方式获取 iframe Dom元素

    Jquery 方式获取 iframe Dom元素 測试页面代码: <html>  <head>   <title>jquery方式,訪问iframe页面dom元素& ...

  5. JS----获取DOM元素的方法(8种)

    什么是HTML DOM 文档对象模型(Document Object Model),是W3C组织推荐的处理可扩展置标语言的标准编程接口.简单理解就是HTML DOM 是关于如何获取.修改.添加或删除 ...

  6. JS选取DOM元素的方法

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

  7. JS添加或删除HTML dom元素的方法实例分析

    本文实例讲述了JS代码添加或删除HTML dom元素的方法.分享给大家供大家参考,具体如下: 创建新的 HTML 元素 如需向 HTML DOM 添加新元素,您必须首先创建该元素(元素节点),然后向一 ...

  8. 关于jq的load不用回调获取其中dom元素方法

    jq的load方法如果要操作其中的dom元素,需要使用回调,等其加载完了再进行dom元素的获取,今天看我们项目组长写的一段代码,发现不用回调也能获取到其中的元素. 具体是这样写的: <scrip ...

  9. 获取或操作DOM元素特性的几种方式

    1. 通过元素的属性 可以直接通过元素属性获取或操作特性,但是只有公认的特性(非自定义的特性),例如id.title.style.align.className等,注意,因为在ECMAScript中, ...

随机推荐

  1. Ubuntu编译ruby

    要用sass,需要ruby2.0以上版本 ubuntu升级ruby到2.1 1.安装前更新: sudo apt-get -y update sudo apt-get install cmake sud ...

  2. 用 Flask 来写个轻博客 (36) — 使用 Flask-RESTful 来构建 RESTful API 之五

    目录 目录 前文列表 PUT 请求 DELETE 请求 测试 对一条已经存在的 posts 记录进行 update 操作 删除一条记录 前文列表 用 Flask 来写个轻博客 (1) - 创建项目 用 ...

  3. mysql null 值查询问题

    我在开发公司内部的一个项目时遇到一个问题:select student_quality_id from STUDENT_QUALITY where mark_status=0 and batch_st ...

  4. LeetCode 95. Unique Binary Search Trees II 动态演示

    比如输入为n, 这道题目就是让返回由1,2,... n的组成的所有二叉排序树,每个树都必须包含这n个数 这是二叉树的排列组合的题目.排列组合经常用DFS来解决. 这道题比如输入为3,也就是求start ...

  5. Prometheus 安装与配置

    下载Prometheus https://prometheus.io/download/ wget https://github.com/prometheus/prometheus/releases/ ...

  6. CSS中让背景图片居中且不平铺

    background:url(../images/logo.jpg) no-repeat center ;

  7. 同一台机器上有多个Python版本?

    有关Python网站上的官方文档,如何在Linux上的同一台机器上安装和运行多个版本的Python? 我可以找到大量的博客帖子和答案,但我想知道是否有“标准”官方方式这样做? 或者这完全取决于操作系统 ...

  8. .net core 部署到IIS 以及上 HTTP Error 502.5 - ANCM Out-Of-Process Startup Failure

    安装AspNetCoreModule托管模块后执行 1.net stop was /y 2.net start w3svc 测试可以,但是需要装对应的托管模块的版本. 1. .NET Core与Win ...

  9. 同事遇到了一个问题(在DllMain函数之前抢控制权)

    同事有个需求,他的进程会加载一个DLL,他需要在那个DLL的DllMain函数执行之前控制DLL,修改DLL的内存. 以上工作要求全部在应用层执行. 这个其实有点悲剧. 因为这个需求其实有点坑,因为需 ...

  10. Codeforces 1100E 拓扑排序

    题意及思路:https://blog.csdn.net/mitsuha_/article/details/86482347 如果一条边(u, v),v的拓扑序小于u, 那么(u, v)会形成环,要反向 ...