一、原生JS选择器

JS选择器常用的有getElementById()、getElementsByName()、getElementsByTagName()、getElementsByClassName()、querySelector()、querySelectorAll()

  • A: getElementById(ID): 返回对指定ID的第一个对象的引用,如果在文档中查找一个特定的元素,最有效的方法是getElementById()
  • B: getElementsByName(name): 返回文档中name属性为name值的元素,因为name属性值不是唯一的,所以查询到的结果有可能返回的是一个数组,而不是一个元素。
  • C: getElementsByTagName(tagname): 返回文档中指定标签的元素
  • D: getElementsByClassName():返回文档中所有指定类名的元素
  • E: querySelector():返回文档中匹配指定css选择器的第一个元素
  • F: querySelectorAll():返回文档中匹配指定css选择器的第一个元素

二、jQuery选择器

内容
基本选择器有ID选择器、类选择器、标签选择器、通用选择器,事件的添加方法如下:
$(...).事件名(function() { });
属性样式有:

$(...).css("border","1px solid red")
$(...).css({...})
$(...).css("border")
$(...).attr(属性名,值)
$(...).html() innerHTML
$(...).text() innerText
$(...).val() value值
$(...).addClass() 增加
$(...).removeClass() 移除
$(...).toggleClass() 开关**

选择器的详细使用方法:

Js选择器总结的更多相关文章

  1. js选择器

    原生JS选择器有getElementById.getElementsByName.getElementsByTagName和getElementsByClassName这四个,下面我就一个一个介绍这四 ...

  2. 使用HTML5的JS选择器操作页面中的元素

    文件命名为:querySelector.html,可在Chrome浏览器中预览效果. 1 <!DOCTYPE html> 2 <html lang="en"> ...

  3. js介绍,js三种引入方式,js选择器,js四种调试方式,js操作页面文档DOM(修改文本,修改css样式,修改属性)

    js介绍 js运行编写在浏览器上的脚本语言(外挂,具有逻辑性) 脚本语言:运行在浏览器上的独立的代码块(具有逻辑性) 操作BOM 浏览器对象盒子 操作DOM 文本对象 js三种引入方式 (1)行间式: ...

  4. js导读,js引入,js选择器,事件,操作页面文档,计算后样式,数据类型

    js导读 ''' js属于编写运行在浏览器上的脚本语言 js采用ECMAScript语法 操作BOM:浏览器对象模型 eg:浏览器上下滑动,浏览器历史记录 操作DOM:文档对象模型 ''' js引入 ...

  5. JS高级语法与JS选择器

    元素(element)和节点(node) childNode属性和children属性的区别 <!DOCTYPE html> <html lang="en"> ...

  6. 7-80 HTML5新增的JS选择器

    7-80 HTML5新增的JS选择器 学习要点 HTML5新增的JS选择器 在传统的 JavaScript 开发中,原生的 JavaScript 所提供的 DOM 选择方法并不多,仅仅局限于通过 ta ...

  7. js 进阶 10 js选择器大全

    js 进阶 10 js选择器大全 一.总结 一句话总结:和css选择器很像 二.JQuery选择器 原生javaScript中,只能使用getELementById().getElementByNam ...

  8. 前端(十二)—— JavaScript基础操作:if语句、for循环、while循环、for...in、for...of、异常处理、函数、事件、JS选择器、JS操作页面样式

    JavaScript基础操作 一.分支结构 1.if语句 if 基础语法 if (条件表达式) { 代码块; } // 当条件表达式结果为true,会执行代码块:反之不执行 // 条件表达式可以为普通 ...

  9. JS选择器querySelector和~All,三个原生选择器

    定义: querySelector() 方法返回文档中匹配指定 CSS 选择器的一个元素. 注意: querySelector() 方法仅仅返回匹配指定选择器的第一个元素.如果你需要返回所有的元素,请 ...

随机推荐

  1. 【HTML】中国天气天气插件调用

    https://cj.weather.com.cn/ 输入上面的网址自定义即可

  2. eclipse运行错误提示 Failed to load D:\Android\sdk\build-tools\26.0.0-preview\lib\dx.jar

    前几天在ecplise上运行项目还好好,今天一运行就提示这个错误:Your project contains error(s), please fix them before running your ...

  3. 1级搭建类102-Oracle 11g 单实例 FS(11.2.0.4+RHEL 7)公开

    项目文档引子系列是根据项目原型,制作的测试实验文档,目的是为了提升项目过程中的实际动手能力,打造精品文档AskScuti. 项目文档引子系列目前不对外发布,仅作为博客记录.如学员在实际工作过程中需提前 ...

  4. Python编码小技巧分享【新手必学】

       本次分享了python编程小技巧总结如下,希望对大家有帮助,非常实用哦注意:很多人学Python过程中会遇到各种烦恼问题,没有人帮答疑.为此小编建了个Python全栈免费答疑交流.裙 :一久武其 ...

  5. 在Scala中免费验证

    优锐课带你详细了解如何在Scala中实施免费的monad验证.抽丝剥茧,细说架构那些事! 由于业务数据的复杂性,已经在数据验证上花费了很多精力.在Scala中,提出了使用应用程序进行验证的方法,并被广 ...

  6. jQuery---内容复习

    内容复习 1. 操作样式 (5) 1.1 css操作 设置单个样式 设置多个样式 获取样式 css(name, value) :设置单个样式 css(obj):设置多个样式 css(name):获取样 ...

  7. XJOI CSP-S2 2019开放模拟训练题1 赛后总结

    比赛链接 友好数对 暴力枚举\([L,R]\)之间的所有数,将每个数进行"旋转",看是否符合题意. 注意"旋转"的次数,并不一定是数字位数.只要旋转回到了初始数 ...

  8. AtCoder Beginner Contest 154 题解

    人生第一场 AtCoder,纪念一下 话说年后的 AtCoder 比赛怎么这么少啊(大雾 AtCoder Beginner Contest 154 题解 A - Remaining Balls We ...

  9. [Agc002E/At1999] Candy Piles - 博弈论

    有n堆石子,第i堆有ai个石子.有两种操作: 把石子最多的那一堆给丢掉 把每一堆全部丢掉一个 谁拿走最后石子谁输.判断胜负情况. 直觉转化为一个走棋盘问题 考虑如何计算左下角点的状态 找到原点最右上方 ...

  10. MariaDB Windows 安装

    1.复制安装文件到服务器 2.解压到指定的目录,并创建my.ini: 3.编辑my.ini文件内容 [client] port=3307 [mysql] default-character-set=u ...