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() 方法仅仅返回匹配指定选择器的第一个元素.如果你需要返回所有的元素,请 ...
随机推荐
- 在Windows启动pyspark shell:Failed to find Spark jars directory. You need to build Spark before running this program
D:\Develop tools\spark-2.2.0-bin-hadoop2.7\bin>pyspark2.cmd 'tools\spark-2.2.0-bin-hadoop2.7\bin\ ...
- Linux的VMware虚拟机无法上网问题
很多时候,Linux无法上网,不管改成nat模式还是主机模式都不行.这时候可以选择进行重置: 首先点击编辑,之后点击虚拟网络编辑器, 然后移除VMnet0和VMnet8网络,点击确定: 然后再打开虚拟 ...
- poj2387- Til the Cows Come Home(最短路板子题)
题目描述 Description Bessie is out in the field and wants to get back to the barn to get as much sleep a ...
- Python-Django学习笔记(二)-创建一个Django项目与应用
1.创建一个Django项目 打开cmd命令行,设置好工作目录(cd 目录路径),然后输入 django-admin startproject projectname #必须安装好Django才可以执 ...
- PP: A dual-stage attention-based recurrent neural network for time series prediction
Problem: time series prediction The nonlinear autoregressive exogenous model: The Nonlinear autoregr ...
- render(七)
Vue 的 _render 方法是实例的一个私有方法,它用来把实例渲染成一个虚拟 Node.它的定义在 src/core/instance/render.js 文件中: Vue.prototype._ ...
- CSS伪类before,after制作左右横线中间文字效果
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- git merge代码
把主干合并进分支 git checkout branch git merge origin/master [一开始我使用的是git merge master,提交代码后发现主干和分支还是有差异,如果不 ...
- Ehcache缓存框架与 Shiro 框架 出现出现验证错误 && Tomcat 缓存清除的问题
当一个项目使用久了以后就会出现各种问题,下面是我遇到的一个权限验证错误的问题 我的项目是 Ehcache 结合 Shiro 一起使用的,项目用用久了出现 Token验证错误,Cookie之类 ...
- vue项目出现Module not found: Error: Can't resolve 'stylus-loader'错误解决方案
因为没有安装stylus和stylus-loader npm install stylus stylus-loader --save-dev 安装成功后,使用npm install重新建立依赖 打开项 ...