原生写一个一键获取所有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到一个数组中:

原生写一个一键获取所有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中, ...
随机推荐
- nginx启动、关闭、重启及常用的命令
nginx常用命令 启动:cd /usr/local/nginx/sbin./nginxnginx服务启动后默认的进程号会放在/usr/local/nginx/logs/nginx.pid文件cat ...
- 测开之路四十九:用Django实现扑克牌游戏
用Django实现和之前flask一样的扑克牌游戏 项目结构 html <!DOCTYPE html><html lang="en"><head> ...
- 阿里云二级域名解析指向服务器另一台主机— —Nginx
这是在一台阿里云服务器没有任何域名,但是配置高,因此想借用另一台阿里云服务器(配置较低)已备案的域名 跳转到这台配置高的服务器,那么使用nginx反向代理 server { listen 80; se ...
- 用Linux 搭建 PXE 网络引导环境
本例子中使用了CentOS7.4 minimal 系统,并且关闭了防火墙和selinux,并使用了dhcp.tftp.http和samba服务. 假设PXE服务器是192.168.4.104 ,tft ...
- 插件化框架解读之四大组件调用原理-Service(三)下篇
阿里P7移动互联网架构师进阶视频(每日更新中)免费学习请点击:https://space.bilibili.com/474380680 本文将继续通过Service调用原理来解读Replugin插件化 ...
- Scrapy框架: 通用爬虫之CSVFeedSpider
步骤01: 创建项目 scrapy startproject csvfeedspider 步骤02: 使用csvfeed模版 scrapy genspider -t csvfeed csvdata g ...
- 从一个Activity打开另外一个Activity
public class MainActivity extends Activity { /** Called when the activity is first created. */ @Over ...
- js确认末尾字符算法挑战
检查一个字符串(str)是否以指定的字符串(target)结尾. 如果是,返回true;如果不是,返回false. 这个挑战可以通过在ES2015中引入的.endsWith()方法来解决.但是出于这个 ...
- rsync nfs 实时同步,结合实战
目录 rsync nfs 实时同步,实战 一.部署rsync服务端(backup) 二.部署rsync客户端(nfs,web01) 三.部署web代码(web01) 四.NFS服务端部署(nfs) 五 ...
- Codeforces 1178E
题意:给你一个长度为n的字符串,只包含a, b, c3种字符,字符串中相邻字符一定不同,问是否存在一个长度为n / 2(向下取整)的子序列是回文的,有就输出. 思路:相邻的字符一定不同,并且一共只有3 ...