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. 一个新实验：使用gRPC-Web从浏览器调用.NET gRPC服务

    今天给大家翻译一篇由ASP.NET首席开发工程师James Newton-King前几天发表的一篇博客,文中带来了一个实验性的产品gRPC-Web.大家可以点击文末的讨论帖进行相关反馈.我会在文章末尾 ...

  2. ant编译solr源码生成eclipse项目，解决一直resolve，一直[ivy:retrieve]的问题

    这两天在学习solr,结果刚到编译solr源码就卡住了,足足卡了两天,网上找各种解决办法都是简单带过,说是缺少jar包,下载下来放到对应位置就好了....对应位置???咋不说这个问题用相应方法解决即可 ...

  3. （三）Mybatis类型转换器，接口传参类型，一对一，一对多查询resultMap配置

    Mybatis类型转换器 首先明白什么时候用到它,当数据库的字段类型和java字段类型无法默认匹配时候进行转换,比如现在数据库类型是INTEGER,而java当中类型是Boolean,true表示1, ...

  4. cmake处理多源文件目录的方法（转）

    cmake处理源代码分布在不同目录中的情况也很简单,现在假设我们的源代码分布情况如下: 源代码的分布情况 其中src目录下的文件要编译成一个链接库 第一步,项目主目录中的CMakelist.txt 在 ...

  5. NAT 地址转换

    NAT功能        NAT不仅能解决了lP地址不足的问题,而且还能够有效地避免来自网络外部的攻击,隐藏并保护网络内部的计算机.1.宽带分享:这是 NAT 主机的最大功能.解决IP4地址短缺的问题 ...

  6. 珠峰-6-node

    1. js主线程是单线程的. 2. path.resolve 传('/')解析出一个绝对路径.

  7. 安全扫描工具Acunetix即AWVS_13.x系列破解版Linux & Windows

    本站所提供工具仅供技术学习交流.请勿用于非法行为.否则后果自负. Acunetix,自动化网络应用安全软件的先驱,已经宣布发布Acunetix第13版.新版本提供了一个改进的用户界面,并引入了创新,如 ...

  8. bootstrap-table.js 自适应窗体设置

    $(window).resize(function () { $('#dtOrder').bootstrapTable('resetView') })

  9. opencv —— approxPolyDP 生成逼近曲线

    生成逼近曲线:approxPolyDP 函数 该函数采用 Douglas-Peucker 算法(也称迭代终点拟合算法).可以有效减少多边形曲线上点的数量,生成逼近曲线,简化后继操作. 经典的 Doug ...

  10. Win10好用的快捷键

    Win10好用的快捷键 Win键,Tab键,空格键,上下左右方向键,Enter键,Shift+Tab键 Win键--Tab键--上下左右方向键--Enter确定或者---空格键(确定的意思),Ente ...