Js选择器总结
一、原生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选择器总结的更多相关文章
- js选择器
原生JS选择器有getElementById.getElementsByName.getElementsByTagName和getElementsByClassName这四个,下面我就一个一个介绍这四 ...
- 使用HTML5的JS选择器操作页面中的元素
文件命名为:querySelector.html,可在Chrome浏览器中预览效果. 1 <!DOCTYPE html> 2 <html lang="en"> ...
- js介绍,js三种引入方式,js选择器,js四种调试方式,js操作页面文档DOM(修改文本,修改css样式,修改属性)
js介绍 js运行编写在浏览器上的脚本语言(外挂,具有逻辑性) 脚本语言:运行在浏览器上的独立的代码块(具有逻辑性) 操作BOM 浏览器对象盒子 操作DOM 文本对象 js三种引入方式 (1)行间式: ...
- js导读,js引入,js选择器,事件,操作页面文档,计算后样式,数据类型
js导读 ''' js属于编写运行在浏览器上的脚本语言 js采用ECMAScript语法 操作BOM:浏览器对象模型 eg:浏览器上下滑动,浏览器历史记录 操作DOM:文档对象模型 ''' js引入 ...
- JS高级语法与JS选择器
元素(element)和节点(node) childNode属性和children属性的区别 <!DOCTYPE html> <html lang="en"> ...
- 7-80 HTML5新增的JS选择器
7-80 HTML5新增的JS选择器 学习要点 HTML5新增的JS选择器 在传统的 JavaScript 开发中,原生的 JavaScript 所提供的 DOM 选择方法并不多,仅仅局限于通过 ta ...
- js 进阶 10 js选择器大全
js 进阶 10 js选择器大全 一.总结 一句话总结:和css选择器很像 二.JQuery选择器 原生javaScript中,只能使用getELementById().getElementByNam ...
- 前端(十二)—— JavaScript基础操作:if语句、for循环、while循环、for...in、for...of、异常处理、函数、事件、JS选择器、JS操作页面样式
JavaScript基础操作 一.分支结构 1.if语句 if 基础语法 if (条件表达式) { 代码块; } // 当条件表达式结果为true,会执行代码块:反之不执行 // 条件表达式可以为普通 ...
- JS选择器querySelector和~All,三个原生选择器
定义: querySelector() 方法返回文档中匹配指定 CSS 选择器的一个元素. 注意: querySelector() 方法仅仅返回匹配指定选择器的第一个元素.如果你需要返回所有的元素,请 ...
随机推荐
- Genymotion下载及安装(安卓虚拟机)
Genymotion下载及安装 一.注册\登录 打开Genymotion官网,https://www.genymotion.com/ ,首先点击右上角的Sign in进行登录操作.如何登录就不细讲 ...
- python的循环语句
python的循环语句有两种:for 和 while,for循环是对可迭代对象进行迭代并处理,因此for的对象是一个可以迭代的对象,而while循环的条件则是一个布尔值可以是一个返回布尔值的表达式. ...
- VMware安装centos7与配置网络
自己想搭建个虚机学习下k8s,使用VMware安装centos7,上不了网,折腾了很久才连上.发现网上很多教程都是错误的或者不明确的,这边写下自己的配置记录 首先安装centos7系统就不赘述了,这边 ...
- Luogu1287 | 盒子与球 (排列组合)
贴一个和其他题解不一样的做法 QWQ 题意:让我们求出 N 个球放入 R 个盒子且每个盒子都必须放球方案数. 首先,对于每一个球,可以将其放入的盒子数量共有 R 个,所以我们可以知道如果无需满足每个盒 ...
- C#之Quartz任务调度的使用(2.2.3.400)
这里使用的Quartz版本号为2.2.3.400,.net 框架为4.0. 目的实现一个小案例,每隔一秒钟打印一条记录.后面会附上源码,以供参考. 建立一个 控制台程序. 代码: class Pro ...
- centos 7 源码安装openresty
Openresty 官网 http://openresty.org Openresty源码下载页面 http://openresty.org/en/download.html Openresty 简易 ...
- 关于Oracle的使用
1.查看数据库 在sqlplus / as sysdba执行后,再执行select name from v$database; 2.执行1后继续查看该数据库下的表 select table_name ...
- Ubuntu中chrome浏览器安装、卸载
一.卸载 sudo apt-get autoremove google-chrome-stable 删除下载源:sudo rm /etc/apt/sources.list.d/google-chrom ...
- 解决Oracle ORA-01033: ORACLE initialization or shutdown in progress错误 和 ORA-01589错误 要打开数据库则必须使用 RESETLOGS 或 NORESETLOGS 选项
要打开数据库则必须使用 RESETLOGS 或 NORESETLOGS 选项 SQL> startupORACLE 例程已经启动. Total System Global Area 13533 ...
- 解决:java.lang.ClassNotFoundException: org.apache.xmlbeans.XmlObject报错问题。
利用POI操作PPT一直报如下错误java.lang.ClassNotFoundException: org.apache.xmlbeans.XmlObject 是因为项目中缺少一个包xmlbeans ...