zoukankan      html  css  js  c++  java
  • DOM(三):querySelector和querySelectorAll

    querySelector()方法
    querySelector()方法接收一个css选择符,返回与该模式匹配的第一个元素,如果没有找到匹配的元素,返回null。

    //取得body元素
    var body = document.querySelector('body');
    //取得id为'myDiv'的元素
    var myDiv = document.querySelector('#myDiv');
    //取得类为'selected'的第一个元素
    var selected = document.querySelector('.selected');
    //取得类为'button'的第一个图像元素
    var img = document.querySelector('img.button');

    querySelectorAll()方法
    querySelectorAll()方法接收的参数与querySelector()方法一样,都是一个css选择服,但返回的是所有匹配的元素而不仅仅是一个元素。
    这个方法返回的是一个NodeList实例

    //取得某<div>中的所有<em>元素(类似于getElementsByTagName('em'))
    var ems = document.getElementById('myDiv').querySelectorAll('em');
    
    //取得类为'selected'的所有元素
    var selecteds = document.querySelectorAll('.selected');
    
    //取得所有<p>元素的所有<strong>元素
    var strongs = document.querySelectorAll('p strong');

    要取得返回的NodeList中的每一个元素,可以使用item()方法,也可以使用方括号语法

    var i,len,strong;
    for(i=0; len=strongs.length; i<len; i++){
        strong = strongs[i]; //或者strongs.item(i)
        strong.className = 'import';
    }
  • 相关阅读:
    在一个页面用Ajax访问另一个页面弹出询问框怎么办
    还有一张呢
    系统相关信息查看
    linux dd 命令使用说明
    Github 使用说明
    Hadoop HA 资料
    fedora 在virtualbox安装guest additions
    git 使用记录
    linux console 小技巧
    Agent admitted failure to sign using the key 错误及解决方法
  • 原文地址:https://www.cnblogs.com/wzndkj/p/8757041.html
Copyright © 2011-2022 走看看