同级选择器_基础选择器

最新推荐文章于 2023-10-07 22:14:38 发布

知乎问题商店

最新推荐文章于 2023-10-07 22:14:38 发布

阅读量280

点赞数

文章标签：同级选择器

本文链接：https://blog.csdn.net/weixin_29338361/article/details/112665026

版权

JavaScript中，获取元素用getElementById( ),getElementsByTagName( )等，这些方式都比较长和麻烦，但是在jQuery将会简单和简洁。

可以用jQuery选择器简洁的获取元素，jQuery选择器分为“基础选择器”和“伪类选择器”，这一节就介绍“基础选择器”。

“基础选择器”分为三种：

(1)基本选择器

(2)层次选择器

(3)属性选择器

基本选择器

基本选择器有四种分别是：

(1)元素选择器

(2)id选择器

(3)class选择器

(4)群组选择器

元素选择器

用法：

$("元素名")

举例：

DOCTYPE html>

<html>

<head>

<title>基本选择器——元素选择器title>

$(function(){

$("div").css("color","red");

})

script>

head>

<body>

<div>刘德华div>

<span>张学友span>

<div>郭富城div>

<span>黎明span>

body>

html>

在上面的例子中，$(function(){......})就是window.οnlοad=function(){...}。$("div")表示选中所有div元素，这可以看成对象，css是一个对象方法用来定义样式。

id选择器

用法：

$("#id名")

class选择器

用法：

$(".类名")

群组选择器

用法：

$("选择器1,选择器2,...,选择器n")

层次选择器

通过元素之间的层次关系来选择元素。常用层次选择器如下表。

选择器	说明
M N	后代选择器：M元素内部的所有后代N元素
M>N	子代选择器：M元素内部的子代1级N元素
M~N	兄弟选择器：M元素后面所有同级N元素
M+N	相邻选择器：M元素相邻的同级N元素

属性选择器

常见属性选择器如下表：

选择器	说明
E[attr]	E元素必须有attr属性
E[attr = "value"]	E元素的attr属性取值是"value"
E[attr != "value"]	E元素的attr属性取值不是"value"
E[attr ^= "value"]	E元素的attr属性取值是以"value"开头的任何字符
E[attr $= "value"]	E元素的attr属性取值是以"value"结尾的任何字符
E[attr *= "value"]	E元素的attr属性取值是包含"value"的任何字符
E[attr \|= "value"]	E元素的attr属性取值等于"value"或以"value"开头
E[attr ~= "value"]	E元素的attr属性取值等于"value"或包含"value"

E是元素，attr是属性，value是属性值。

本节主要学习了基础选择器，最后对其总结。

基本选择器
层次选择器
属性选择器

知乎问题商店

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
同级选择器_基础选择器

JavaScript中，获取元素用getElementById( ),getElementsByTagName( )等，这些方式都比较长和麻烦，但是在jQuery将会简单和简洁。可以用jQuery选择器简洁的获取元素，jQuery选择器分为“基础选择器”和“伪类选择器”，这一节就介绍“基础选择器”。“基础选择器”分为三种：(1)基本选择器(2)层次选择器(3)属性选择器基本...
复制链接

扫一扫

同级选择器_基础选择器

“相关推荐”对你有帮助么？