zoukankan      html  css  js  c++  java
  • JavaScript查找HTML节点,以及常用的jQuery选择器

      Document接口提供了查找节点的方法,这些方法都是在整个HTML文档中查找节点。

    (1)document.getElementById("id");

    通过ID获取html元素对象,ID号在html文档当中应该是唯一的。返回的是唯一element对象。并且所有浏览器都兼容。

    (2)document.getElementsByTagName("tagName");

    通过标签查找html对象,返回的是一个数组。可以根据标签出现的位置定位元素的对象。所有浏览器都兼容。

    (3)document.getElementsByName("name");

    通过name属性来定位html对象,这个方法返回的是一个数组,同样我们也可以根据html当中name的位置,进行对name的定位。IE系列不兼容。

      jQuery的选择器分为基本选择器、层次选择器、过滤选择器和表单选择器。

      1、基本选择器是jQuery中最常用的选择器,也是最简单的选择器,它通过元素id、class和标签名等来查找DOM元素。

      (1)$("#test")       选取id为test的元素

      (2)$(".test")    选取所有class为test的元素

      (3)$("p")    选取所有的<p>元素

      (4)$("*")    选取所有的元素

      (5)$(".intro.demo")  所有 class="intro" 且 class="demo" 的元素

        2、层次选择器通过DOM元素之间的层次关系来获取特定的元素。

      (1)$("div span")选取<div>里面的所有<span>元素。(后代元素,包括子元素的子元素...)

      (2)$("div > span")选取<div>元素下元素名是<span>的所有子元素。

       3、过滤选择器的过滤规则与CSS中的伪类选择器语法相同。

      (1)$("[href='#']")  所有 href 属性的值等于 "#" 的元素

      (2)$("[href$='.jpg']")   所有 href 属性的值包含以 ".jpg" 结尾的元素

        4、表单选择器

      (1)$(":input")选取所有<input>、<textarea>、<select>、<button>元素。

      (2)$(":checkbox")   所有 type="checkbox" 的 <input> 元素

      (3)$(":radio")  所有 type="radio" 的 <input> 元素

  • 相关阅读:
    Error no matching function for call to 'std::exception::exception(const char [15])'
    Difference between 'SAME' and 'VALID' padding
    使用 RamMap 清理内存 How to Use RamMap to Empty System Working Set
    Ubuntu中网络配置interfaces与界面网络配置NetworkManager
    ifup / ifdown eth0 / eno1 reports unknown interface when it exists!
    Tab Key not working when using Xfce remote desktop
    Batch Norm、Layer Norm、Weight Norm与SELU
    IIS 域名 带参数 设置重定向
    C# 切换到二级域名,使用Cookie
    web服务器 双网卡 路由 设置
  • 原文地址:https://www.cnblogs.com/moleme/p/4392573.html
Copyright © 2011-2022 走看看