JS 获取标签的方法

通过class： document.getElementsByClassName('class名');返回数组
通过name： document.getElementsByName('name名');返回数组
通过id： document.getElementById('id名')；返回一个对象
通过标签名： document.getElementsByTagName(‘标签名’);返回数组
通过通用选择器：document.querrySelector('可以写任何选择器 只能选择一个');返回数组
通过通用选择器：document.querrySelectorAll('可以写任何选择器，可以选择多个');返回数组

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>Document</title>

 </head>

 <body>

     <div class='box' id="box" name='box' ></div>

 </body>

     <script type="text/javascript">

         var div1 = document.getElementsByClassName('box')[0];

                 //利用class名获取元素

         var div2 = document.getElementsByName('box')[0];

         var div3 = document.getElementById('box');\\获取到了div

         var div4 = document.getElementsByTagName('div')[0];

          //获取到了div

          //element加了s表示是集合 获取的是一组元素 是伪数组

          //可以在获取元素后面加[写你想要的那个元素 数字表示 下标是0];

          var div5 = document.querySelector('.box')[0];

         //获取class 要加 . //获取id    要加#

         var div6 = document.querySelectorAll('.box')[0];

         //是个集合可以选择多个

 console.log(div);//console.log(document.querySelector('.class'))

     </script>

 </html>

 ​
获取html
 console.log(document.documentElement)

获取body的方法
 console.log(document.body)

JS：获取标签的6个方法+获取html+获取body的更多相关文章

  1. js 复制 标签中的内容 方法

    <span id='id'>hello world</span><input type='button' onClick='copy("id")' v ...

  2. 第7天：javascript-DOM 获取标签、注册事件改变属性的值、innerText、改变属性的值等

    javascript WEB api------DOM document object model 案例 为元素注册点击事件,弹出对话框 <input type="button&quo ...

  3. java：JavaScript2：（setTimeout定时器，history.go()前进/后退，navigator.userAgent判断浏览器，location.href，五种方法获取标签属性，setAttribute，innerHTML，三种方法获取form表单信息，JS表单验证，DOM对象，form表单操作）

    1.open,setTimeout,setInterval,clearInterval,clearTimeout <!DOCTYPE> <html> <head> ...

  4. JS获取标签内容的方法

    JS获取标签内容的方法 测试代码 <!DOCTYPE html> <html lang="en"> <head> <meta charse ...

  5. JS获取标签方法及兼容处理

    document.getElementById('Id名');  // 所有浏览器 document.getElementsByTagName('标签名'); // 所有浏览器 document.ge ...

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

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

  7. js方法用来获取路径传参上所带的参数

    //js方法用来获取路径传参上所带的参数 function GetQueryString(param) { var reg = new RegExp("(^|&)" + p ...

  8. JS获取当前页面URL的方法

    1.JS获取当前页面URL的方法小结 ①. document.URL;                           http://localhost:81/Test/1.htm/id/12 ② ...

  9. js ajax设置和获取自定义header信息的方法总结

    目录 1.js ajax 设置自定义header 1.1 方法一: 1.2 方法二: 2.js ajax 获取请求返回的response的header信息 3.js ajax 跨域请求的情况下获取自定 ...

随机推荐

  1. MingGW Posix VS Win32 - 明瓜娃的毒因

    MinGW-posix和win32纠缠的瓜娃子 官方首席佛偈(SourceForge)的官网下载页 法克油啊,让我一个小白情何以堪. 盘TA wiki posix wiki中文-UNIX API标准 ...

  2. Yandex Big Data Essentials Week1 Unix Command Line Interface Processes managing

    free displays the total amount of free and used memory free [options] top provides a dynamic real-ti ...

  3. DNS 查询 - Domain Name Server

    DNS 查询 - Domain Name Server socket.getaddrinfo("www.baidu.com",None) 返回时一个 tuple list - (f ...

  4. 基于MATLAB的单级倒立摆仿真

    有关代码及word文档请关注公众号“浮光倾云”,后台回复A010.02即可获取 一.单级倒立摆概述 倒立摆是处于倒置不稳定状态,人为控制使其处于动态平衡的一种摆,是一类典型的快速.多变量.非线性.强耦 ...

  5. 你还用拼音为变量命名?新人OIer别傻了,教你写出优质代码

    本篇文章适用语言:python,c++,Java.(其实我就是随便bb) 我们在编辑代码的时候,不免拿其他人的代码进行学习,或者将自己的代码拿给别人修改.这个时候,如何让别人快速读懂你的代码,是提升效 ...

  6. vSphere虚拟系统 添加虚拟服务器

    虚拟插槽数:插槽的概念与物理服务器的物理CPU类似,为虚拟机分配m个插槽,相当于为物理服务器配置了m颗物理CPU: 每个插槽的内核数:相当于物理服务器每颗物理CPU的核心数为n: 在上述条件下虚拟机获 ...

  7. Nginx 十大优化 与 防盗链

    Nginx是俄罗斯人编写的十分轻量级的HTTP服务器,Nginx,它的发音为“engine X”,是一个高性能的HTTP和反向代理服务器,同时也是一个IMAP/POP3/SMTP 代理服务器．Ngin ...

  8. hadoop简介和环境

            Hadoop是一个由Apache基金会所开发的分布式系统基础架构.用户可以在不了解分布式底层细节的情况下,开发分布式程序.充分利用集群的威力进行高速运算和存储. Hadoop实现了一个 ...

  9. 数组和CLR-非常特殊的关系

    目录 数组和CLR-非常特殊的关系 公共语言运行时(CLR)的基础 内存和类型安全 实现细节 特殊帮助器类 移除边界检查 分配数组 运行时以不同的方式对待数组 进一步阅读 数组源码引用 参考文档 数组 ...

  10. 最通俗易懂的 Java 10 新特性讲解

    自从 Java 9 开始,Oracle 调整了 Java 版本的发布策略,不再是之前的 N 年一个大版本,取而代之的是 6 个月一个小版本,三年一个大版本,这样可以让 Java 的最新改变迅速上线,而 ...