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. Pycharm学习记录---同一目录下无法import明明已经存在的.py文件

    转自:https://blog.csdn.net/l8947943/article/details/79874180 问题描述: 如图:同目录下明明存在相应文件,在导入时却出现带有红色波浪线,说没有相 ...

  2. 第3章 JDK并发包(三)

    3.2 线程复用:线程池 一种最为简单的线程创建和回收的方法类似如下代码: new Thread(new Runnable() { @Override public void run() { // d ...

  3. Spring Boot 2.x基础教程:使用Spring Data JPA访问MySQL

    在数据访问这章的第一篇文章<Spring中使用JdbcTemplate访问数据库> 中,我们已经介绍了如何使用Spring Boot中最基本的jdbc模块来实现关系型数据库的数据读写操作. ...

  4. My introduction

    Vistors 访客统计

  5. python学习(9)字典的基本应用

    字典是一种通过名字或者关键字引用的得数据结构,其键可以是数字.字符串.元组,这种结构类型也称之为映射.字典类型是Python中唯一內建的映射类型.字典可以理解为列表的升级版. dict是无序的 key ...

  6. 制作一个docker镜像:mysql-8-x64-linux

    因为个人学习需要,为软件系统的虚拟容器化,以下将mysql制作为docker镜像,并记录下详细步骤. 欢迎大家学习交流和转载,同时写作不易,如果各位觉得不错,请点赞支持. 备注:以下代码和文章,欢迎复 ...

  7. 使用requests、re、BeautifulSoup、线程池爬取携程酒店信息并保存到Excel中

    import requests import json import re import csv import threadpool import time, random from bs4 impo ...

  8. Ubuntu Xftp 配置

    sudo apt-get updatesudo apt install openssh-serversudo apt-get install vsftpdsudo service vsftpd res ...

  9. IO包中的RandomAccessFile类

    RandomAccessFile RandomAccessFile 是随机访问文件的类.它支持对文件随机访问的读取和写入,即我们也可以从指定的位置读取/写入文件数据,因为该类在其内部封装了一个数组和指 ...

  10. JDBC 及 sql注入问题

    一.相关概念 1.什么是JDBC JDBC(Java Database Connectivity,java数据库连接)是一种用于执行SQL语句的Java API,可以为多种关系数据库提供统一访问,它由 ...