querySelector选择器可以通过document和element来调用他们

用来代替getElementById

            var body=document.querySelector("body");//取到body
body.appendChild(document.createTextNode("ffff"));
var div=document.querySelector("#div1");//取到id为div1的第一个元素
var div=document.querySelector(".div1");//取到类为div1的第一个元素
var img=document.querySelector("img.button");//取到类为button的第一个图像元素

querySelectorAll和上面的一样,返回的不仅仅是一个元素,有点像nodelist

            var em=document.getElementById("div1").querySelectorAll("em");//取得div中所有的em元素
var div=document.querySelectorAll(".div")//取得所有的div元素
var strong=document.querySelectorAll("p strong");//取得p元素里面所有的strong元素

querySelector选择器的更多相关文章

  1. DOM querySelector选择器

    原生的强大DOM选择器querySelector 在传统的 JavaScript 开发中,查找 DOM 往往是开发人员遇到的第一个头疼的问题,原生的 JavaScript 所提供的 DOM 选择方法并 ...

  2. querySelector() 选择器语法

    选择器 示例 示例说明 CSS .class .intro 选择所有class="intro"的元素 1 #id #firstname 选择所有id="firstname ...

  3. js 的常用选择器

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. js api 之 fetch、querySelector、form、atob及btoa

    js api 之 fetch.querySelector.form.atob及btoa 转载请注明出处: https://www.cnblogs.com/funnyzpc/p/11095862.htm ...

  5. DOM的选择器

    这几天学习了DOM的选择器,现在来进行一下总结分类. 1.DOM里的元素节点选择器 元素节点选择器包括id,class,name,tagname,高级,关系. 1.1 id选择器 id:返回的是单个对 ...

  6. 关于DOM的一些总结(未完待续......)

    DOM 实例1:购物车实例(数量,小计和总计的变化) 这里主要是如何获取页面元素的节点: document.getElementById("...") cocument.query ...

  7. DOM查找元素

    1. 查找元素5种: 1. 按id查找1个元素对象: var elem=document.getElementById("id值"); 何时使用:1. 元素必须有id 2. 精确查 ...

  8. 11-17的学习总结(DOMfirstday)

    HTML: 超文本标记语言,专门定义网页内容的语言 XHTML: 严格的HTML标准 DHTML: 所有实现网页动态效果技术的统称 XML: 可扩展的标记语言,标签都是自定义的 XML语法和HTML语 ...

  9. DOM&BOM笔记

    day01正课:1. DOM概述2. ***DOM树3. *查找 1. DOM概述: DHTML:动态网页技术的统称 DHTML=HTML+CSS+JS 鄙视题: HTML XHTML DHTML X ...

随机推荐

  1. 14.1.1 使用InnoDB 表的好处:

    14.1.1 Benefits of Using InnoDB Tables 14.1.2 Best Practices for InnoDB Tables 14.1.3 Checking InnoD ...

  2. BZOJ1709: [Usaco2007 Oct]Super Paintball超级弹珠

    1709: [Usaco2007 Oct]Super Paintball超级弹珠 Time Limit: 5 Sec  Memory Limit: 64 MBSubmit: 324  Solved: ...

  3. 自己动手学TCP/IP–http协议(http报文头)

    在前面的一篇文章中,简单了介绍了HTTP报文格式,详情参考http://www.firefoxbug.net/?cat=47. 这里大概介绍下基本的,常见的HTTP包头格式. POST /report ...

  4. Delphi 多线程的操作

    Delphi 操作多线程的代码, 在项目中需要在webservice中使用多线程,程序思想如下: 1.就创建一个线程, 也就是说有两个线程,主线程和创建的线程, 主线程用于程序的别的操作,例如停止服务 ...

  5. Java学习日记-2.2 增强后的switch-case

    switch-case语句的基本格式 switch(expression){ case condition1: ... break; case condition2: ... break; case ...

  6. [Java] 类和接口的初始化步骤 - 继承方面

    类和接口在初始化化时,处理继承层级的方法不一样. 类继承的初始化:通过引用 static 字段,触发某个类的初始化,则声明该字段的类,以及该类的父类被初始化. 接口继承的初始化:通过引用 static ...

  7. [Design Pattern] Singleton Pattern 简单案例

    Singleton Pattern, 即单例模式,用于获取类的一个对象,该对象在整个应用中是其类的唯一对象.单例模式属于创建类的设计模式. SingleObject 作为单例类,内含了一个静态私有的 ...

  8. [Design Pattern] Factory Pattern 简单案例

    Factory Pattern , 即工厂模式,用于创建对象的场景,属于创建类的设计模式 . 下面是一个工厂模式案例. Shape 作为接口, Circle, Square, Rectangle 作为 ...

  9. E - Just a Hook - hdu 1698(区间覆盖)

    某个英雄有这样一个金属长棍,这个金属棍有很多相同长度的短棍组成,大概最多有10w节,现在这个人有一种魔法,他可以把一段区间的金属棍改变成别的物质,例如金银或者铜, 现在他会有一些操作在这个金属棍上,他 ...

  10. python:文本文件处理

    # coding=utf-8 #将列表写入文件 :'w+'(覆盖原有文件内容),'a+'(在原文件的基础上追加) def write_list_test(path,savelist,pattarn): ...