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. 2018天梯赛、蓝桥杯、（CCPC省赛、邀请赛、ICPC邀请赛）校内选拔赛反思总结！

    才四月份,上半年的比赛就告一段落了.. 天梯赛混子,三十个人分最低,把队友拖到了国三,蓝桥杯省二滚粗,止步京城,旅游选拔赛成功选为替补二队,啊! 不过既然已经过去,我们说些乐观的一面,积累了大赛经验是 ...

  2. 利用selenium模拟登陆

    第一部:利用selenium登陆 导入selenium库 from selenium import webdriver 明确模拟浏览器在电脑中存放的位置,比如我存在当前目录 chromePath = ...

  3. 《Head first设计模式》之单例模式

    单例模式(书中叫单件模式,个人习惯叫单例)确保一个类只有一个实例,并提供一个全局访问点. 有一些对象我们只需要一个,比方说:线程池.缓存.对话框.处理器偏好设置和注册表的对象等等.事实上,这类对象只能 ...

  4. 01_TypeScript介绍安装

    1.介绍 TypeScript 是由微软开发得一款开源得编程语言:是JavaScript得超级,遵循ES6,ES5规范:更适合开发大型企业项目. 2.安装 npm install -g typesri ...

  5. 兄弟连 企业shell笔试题 16-31

    企业实践题16:企业案例:写网络服务独立进程模式下rsync的系统启动脚本 例如:/etc/init.d/rsyncd{start|stop|restart} .要求:1.要使用系统函数库技巧.2.要 ...

  6. PDO连接不上又不报错的问题

    前提:连接PDO需要在将php.ini配置文件的 ;extension=pdo_mysql,去掉前面的;号. 今天闲来无事就重新弄了一下PDO,结果怎么都连不上.而且没有给出错误的信息.代码如下: & ...

  7. REDTEAM 指南---第四章 外部侦察

    第四章 外部侦察 贡献者:Haythem Arfaoui 翻译BugMan 主动侦察 介绍 主动足迹涉及使用可以帮助您收集更多信息的工具和技术 有关目标的信息.与被动足迹不同的是,过程永远不会“触及” ...

  8. Windows下配置开机自启Tomcat服务

    给单位内部做了一个管理系统,部署项目要求服务器启动管理系统自启..直接给出操作流程. 一.配置环境变量 由于Tomcat启动依赖jdk,因此需要配置jdk与Tomcat两项环境变量,如系统已安装jdk ...

  9. Git简易教程（常用命令）

    本文章参考了Pro Git 1 Git简介 Linux内核开源项目有着众多参与者,为了提高开发效率,项目组于2002年开始启用分布式版本控制系统BitKeeper来管理和维护代码.在BitKeeper ...

  10. 「Flink」Flink中的时间类型

    Flink中的时间类型和窗口是非常重要概念,是学习Flink必须要掌握的两个知识点. Flink中的时间类型 时间类型介绍 Flink流式处理中支持不同类型的时间.分为以下几种: 处理时间 Flink ...