首页
学习
活动
专区
圈层
工具
发布

《CSS选择器世界》读书笔记

CSS选择器的优先级 等级 选择器 例子 0级 通配选择器、选择符和逻辑组合伪类 通配选择器*、选择符(+、~、空格、>)、伪类如:not等 1级 标签选择器 body {} 2级 类选择器、属性选择器和伪类...精通CSS选择符 四大选择符:后代选择符(空格),孩子选择器(>),相邻兄弟选择符(+)、后面兄弟选择符(~)。...[attr] 包含指定属性就可以了 [disabled] {} boolean型属性用的比较多 [attr=”val”] 属性和值都需要匹配 [type="radio"] {} 值可以是单引号、双引号或者不写..."> 之前说过属性选择器,属性是忽略大小写的,属性的值是大小写敏感的,如果需要属性值也忽略大小写的话可以在属性中加一个i或者I,则表示大小写不敏感,如:[attr*="val" i]。...:placeholder-show:占位符显示时匹配,由于占位符是在输入内容为空的时候出现,所以可以使用:placeholder-show来判断表单是否为空。

44810

Groovy语法系列教程之字符串(三)

则您的字符串将包含缩进的空格。...插值是在评估字符串时用其值替换字符串中占位符的行为。占位符表达式由${}包围。 对于明确的点分表达式,可以省略花括号,即在这种情况下,我们可以只使用$前缀。...但是,语句的值是null。 因此,如果在该占位符中插入了多个语句,则最后一个应以某种方式返回要插入的有意义的值。...包含圆括号的表达式(例如方法调用,用于闭包的大括号,不属于属性表达式或算术运算符的点)将无效。...GString中转义$或${}占位符,以便它们按原样显示而无需插值,则只需要使用`反斜杠字符即可转义美元符号: assert '$5' == "\$5" assert '${name}' == "\${

8.9K51
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    C语言 -- printf 的花式操作

    在使用 gcc 进行编译的时候会出现如下的报错 ? 这个问题是因为printf的用法不符合要求,那正确的用法是什么样的呢?...其中的 format 参数是一个格式化字符串,由格式化占位符和普通字符组成,“,”后面接的是与占位符所对应的数字、字符串等。格式化占位符(以 % 开头)用于指明输出的参数值如何格式化。...每个参数的值应当与前面格式化字符串中的占位符类型和位置一一对应。 ?...2.3 返回值 如果函数调用成功,返回值是实际打印的字符数(不包含表示字符串结束的 ‘\0’);如果函数调用失败,返回值是一个负数 ?...而你如果想将一个字符串分为两行来显示,那么你就需要使用到转义字符。转义字符一般是表示特殊含义的非可见字符,以反斜杠开头,常见的转义字符及其含义如下表 ?

    1.9K70

    《最新出炉》系列初窥篇-Python+Playwright自动化测试-5-元素定位大法-上篇

    Playwright 支持许多不同的选择器,比如 Text、CSS、XPath 等。阅读 in-depth guide 文档,了解更多关于可用的选择器以及如何进行选择的信息。...page.get_by_label()通过关联标签的文本定位表单控件。page.get_by_placeholder()按占位符定位输入。...3.3占位符定位-page.get_by_placeholder()输入可能具有占位符属性,以向用户提示应输入的值。您可以使用page.get_by_placeholder()定位此类输入。...例如,它将多个空格转换为一个空格,将换行符转换为空格,并忽略前导和尾随空格。3.4.1何时使用文本定位器建议使用文本定位器来查找非交互式元素,如div, span, p 等。...如果角色或文本值对您很重要,那么请考虑使用面向用户的定位器,例如角色定位器和文本定位器。例如:以下 DOM 结构。

    5.5K31

    Chrome 控制台console的用法(学了之后对于调试js可是大大有用的哦)

    用于输出警示信息 5、console.debug用于输出调试信息 console对象的上面5种方法,都可以使用printf风格的占位符。...不过,占位符的种类比较少,只支持字符(%s)、整数(%d或%i)、浮点数(%f)和对象(%o)四种。...7、console.group输出一组信息的开头 8、console.groupEnd结束一组输出信息 看你需求选择不同的输出方法来使用,如果上述四个方法再配合group和groupEnd方法来一起使用就可以输入各种各样的不同形式的输出信息...比如用上键就相当于使用上次在控制台的输入符号 2、$_命令返回最近一次表达式执行的结果,功能跟按向上的方向键再回车是一样的 ?...(哈哈 刚刚从控制台复制的body里面的html可以任意粘贴到哪, 比如记事本, 是不是觉得功能很强大) 5、keys和values前者返回传入对象所有属性名组成的数据,后者返回所有属性值组成的数组 ?

    1.5K41

    《刚刚问世》系列初窥篇-Java+Playwright自动化测试-6- 元素基础定位方式-上篇 (详细教程)

    注意:何时使用标签定位器:官网建议在查找表单字段时,请使用此定位器。5.3按占位符定位输入可能具有占位符属性,以提示用户应输入什么值。...注意:何时使用占位符定位器:官网建议在查找没有标签但具有占位符文本的表单元素时,请使用此定位器。5.4按文本定位通过它包含的文本找到一个元素。...注意:(1)按文本匹配始终会使空格归一化,即使完全匹配也是如此。例如,它将多个空格转换为一个空格,将换行符转换为空格,并忽略前导和尾随空格。...如果角色或文本值对您很重要,请考虑使用面向用户的定位器,例如角色和文本定位器。例如:以下 DOM 结构。 ...注意,何时使用 TESTID 定位器:官网建议当您选择使用测试 ID 方法时,或者当您无法按角色或文本进行定位时,也可以使用测试 ID。

    1.5K31

    3. Groovy 语法-字符串学习

    任何Groovy表达式都可以插入到所有字符串中,单引号和三单引号字符串除外。插补是在计算字符串时用它的值替换字符串中的占位符的行为。占位符表达式被${}包围。...如果GString被传递给一个接受String的方法,那么占位符中的表达式值将被求值为它的字符串表示形式(通过对该表达式调用toString()),并将得到的String传递给该方法。...不仅允许表达式出现在{}占位符之间,语句也可以。然而,语句的值只是null。因此,如果在占位符中插入了几个语句,最后一个语句应该以某种方式返回要插入的有意义的值。...例如,“1和2的和等于{def a = 1;Def b = 2;a + b}”是受支持的,而且工作正常,但一个好的实践通常是坚持使用GString占位符中的简单表达式。...包含括号(如方法调用)、花括号(用于闭包)、不是属性表达式一部分的圆点或算术运算符的表达式将是无效的(例如加减运算符,小数点)。

    8K20

    Go 语言中的字符串基本操作

    为了在字符串内部正确地包含双引号等特殊字符,我们就需要使用转义符。 2、使用反斜杠 \ 进行转义 在 Go 中,反斜杠 \ 是核心的转义符。...这种字符串使用反引号 ` (通常位于键盘 Tab 键的上方) 来定义。 在反引号包裹的字符串中,所有的字符都按其字面意义进行解释,无需任何转义。 这种写法的输出结果与使用转义符完全相同。...它允许我们使用一个模板字符串和一系列占位符(也称格式化动词),将变量优雅地嵌入到字符串中。 Printf 的工作方式: 定义一个包含占位符的模板字符串。 在字符串后面,按顺序提供与占位符对应的变量。...以下是一些最常用的占位符: 占位符 描述 常用类型 通用 %v 默认格式的值。...2、大于 (>) 和小于 (<) Go 语言同样支持使用 >、= 和 的大小。 比较规则: 字符串的比较是按字典顺序进行的。

    47130

    HTML 快速入门

    元素的属性: 属性包含有关元素的额外信息,如果不希望这些元素显示在实际内容中。此处是属性名称,并且是属性值。...该属性允许您为元素提供一个非唯一标识符,该标识符可用于使用样式信息和其他内容将其作为目标(以及具有相同值的任何其他元素)class``editor-note``class``class 属性应始终具有以下内容...: 它与元素名称(或上一个属性,如果元素已具有一个或多个属性)之间的空格。...属性名称后跟等号。 由左引号和右引号括起来的属性值。 注意:不包含 ASCII 空格(或任何字符)的简单属性值可以保持不加引号,但建议您引用所有属性值,因为这会使代码更加一致和易于理解。"...请注意,结束标记的名称前面有一个斜杠字符 ,并且在空元素中,结束标记既不是必需的,也不是允许的。如果未提及属性,则在每种情况下都使用默认值; 注意! 元素和标签不是一回事。

    3.7K10

    前端温习(二): Javascriput 核心对象 Document 对象

    节点的 contentDocument 属性 对 Ajax 操作返回的文档,使用 XMLHttpRequest 对象的 responseXML 属性 对于某个节点包含的文档,使用该节点的 ownerDocument...() 方法添加) document.renameNode() 重命名元素或者属性节点 … … 使用 由于属性和方法比较多,就把一些常用的一些属性和方法展开说明。...用户通常可以使用 tab 键移动焦点,使用空格键激活焦点,比如如果焦点在一个链接上,此时按一下空格键,就会跳转到该链接。...,再进行搜索 getElementsByName() 用于选择拥有 name 属性的 HTML 元素,比如 form、img、frame、embed 和 object,返回一个 NodeList...[0].tagName // "FORM" 注意:在IE浏览器使用这个方法,会将没有 name 属性、但有同名 id 属性的元素也返回,所以name和id属性最好设为不一样的值。

    1.2K31

    学习zepto.js(Hello World)

    昨天听说了zepto.js,正好最近也比较闲,所以就学习一下这个著名DOM操作库,由于本人刚接触这个,但又不想单纯的说如何使用,所以本人会按照API顺序来说明方法如何使用并试着将对于源码的理解写上来;...$():   与jQuery的$()几乎一样,但zepto的选择器是直接使用的原生querySelectorAll(),所以,一些jQuery自定义的选择器是不支持的,但可以添加selector.js...对象,   如果selector为字符串,先去除两端空格,然后判断selector是否为包含html标签的字符串,     如果是则通过fragment方法生成一个dom对象并返回,   当验证selector...该方法接收最多三个参数,   第一个为html值,可以只是一个标签,如(“”)、或一个html片段,如(“hello”);   第二个为一个标识符,用来确定标签类型,该变量主要用于对表格类元素进行一些特殊的处理...直接返回空数组(任性~);       但如果满足条件了,继续进行判断,选择器为不包含子选择器的(get√),并且不是通过ID选择的(get√),而且支持getElementsByClassName的(

    4.2K80

    web前端学习摘要。

    背景图片(作为网页的修饰效果,CSS进行表现)。写在css样式表中,如使用background属性来定义背景图。 区别: 1. 内容图片是网页内容数据的一部分,在页面中有占位。...如果加在出现问题或失败,则会出现占位标记,影响页面的排版或布局。 2. 背景图片进用来修饰和没画网页,在页面中没有占位,如果加在失败,对页面的排版没有影响。 判断使用内容图or背景图: 1....href属性: 是其最重要的属性,用来定义链接的目标地址,实现超级链接的功能。如果没有href属性,标签仅仅是超链接的一个占位符。...已被访问过的状态  :visited 3. 鼠标悬停的状态(鼠标移动到链接之上):hove 4. 激活状态(鼠标点击时):active 使用CSS的伪类选择符可以设定超级链接的各种交互状态效果。...声明的时候可以忽略其中某个值的设定。如果同时定义了类型和图像,则图像优先。 实际应用原则: 1. 使用盒子模型属性来精确控制列表 2.

    5.1K30

    说说懒加载怎样实现

    图像占位符: 使用小图标或占位符替换真实的图像,当图像需要加载时再替换成真实的图像源。...图片懒加载的原理: 由于浏览器会自动对页面中的img标签的src属性发送请求并下载图片,可以通过html5自定义属性data-xxx 先暂存src的值,然后在图片出现在屏幕可视区域的时候,再将data-xxx...的值重新赋值到img的src属性即可。...} }); }, { threshold: [0, 1] }); // 设置阈值为0和1,即当图像完全在视口中时才加载 // 选择所有需要懒加载的图像 document.querySelectorAll...如果图像完全在视口中,那么就会加载它的实际源。 注意事项: 性能考量: 懒加载可以提高性能,但过度使用可能导致复杂的逻辑和额外的开销。

    1.1K10

    C语言:基础知识

    TIOBE网站上可以查到每年编程语言的使用排名,其中c语言常见保持前3, 网址:https://www.tiobe.com/tiobe-index/ 二、编译器的选择和使用方法 2.1 编译和链接...12.3 占位符的使用 printf() 可以在输出⽂本中指定占位符。 所谓 “占位符”,就是这个位置可以⽤其他值代⼊。 常⽤的占位符除了 %d ,还有 %s 表⽰代⼊的是字符串。...printf() 参数与占位符是⼀⼀对应关系,如果有 n 个占位符, printf() 的参数就应该有 n + 1 个。如果参数个数少于对应的占位符, printf() 可能会输出内存中的任意值。...如果不满5位,对应的值的前⾯会添加空格。 输出的值默认是右对⻬,即输出内容前⾯会有空格;如果希望改成左对⻬,在输出内容后⾯添加空格,可以在占位符的 % 的后⾯插⼊⼀个 - 号。...如果在成功读取任何数据之前,发⽣了读取错误或 者遇到读取到⽂件结尾,则返回常量 EOF。 13.3 占位符的使用 scanf() 常⽤的占位符如下,与 printf() 的占位符基本⼀致。

    1.1K10

    html5 新特性

    注意:uerySelector() 方法仅仅返回匹配指定选择器的第一个元素         如果你需要返回所有的元素,请使用 querySelectorAll()     语法:document.querySelector...用于转换结果的函数或数组。       如果 replacer 为函数,则 JSON.stringify 将调用该函数,并传入每个成员的键和值。使用返回值而不是原始值。...space:         可选,文本添加缩进、空格和换行符,如果 space 是一个数字,则返回值文本在每个级别缩进指定数目的空格,如果 space 大于 10,         则文本缩进 10...space 有可以使用非数字,如:\t。         返回值:返回包含 JSON 文本的字符串。...7.自定义对象属性:     html5中可以通过data- 前缀就成为data 属性,       也可以应用CSS属性选择器进行样式设置。

    2.2K100

    Swift基础 字符串和字符

    字符串创建和操作的语法轻巧且可读,字符串文字语法与C相似。字符串串联就像将两个字符串与+运算符组合在一起一样简单,字符串的可变性通过在常量或变量之间进行选择来管理,就像Swift中的任何其他值一样。...如果您想使用换行符使源代码更容易阅读,但不希望换行符成为字符串值的一部分,请在这些行末尾写一个反斜杠(\): let softWrappedQuotation = """ The White Rabbit...,此占位符将被multiplier的实际值取代。...要在使用扩展分隔符的字符串中使用字符串插值,请将反斜杠后的数字符号数量与字符串开头和结尾的数字符号数量匹配。例如: print(#"6 times 7 is \#(6 * 7)....因此,Swift字符串无法按整数值进行索引。 使用startIndex属性访问String的第一个Character的位置。TheendIndex属性是String中最后一个字符后的位置。

    57000

    DOM扩展

    尽管DOM作为API已经非常完善了,但是为了实现更多的功能,仍然会有一些标准或专有的扩展。对DOM的两个主要扩展是Selectors API(选择符API)和HTML5。...一、选择符API Selectors API是由W3C发起制定的一个标准,致力于让浏览器原生支持CSS查询。其核心的两个方法:querySelector()和querySelectorAll()。...1. querySelector()方法 querySelector()接受一个CSS选择符,返回与该模式匹配的第一个元素,如果没有找到匹配的元素返回null。...()方法 querySelectorAll()接受一个CSS选择符,返回与该模式匹配的NodeList实例,如果没有找到匹配的元素返回null。...示例: var lis = document.querySelectorAll("ul li"); // 获取第一个li lis.item(0); // 等价于:lis[0]; 注意:上述两个函数如果传入不支持的选择符

    1.9K31

    通过css类选择器选取元素 文档结构和遍历 元素树的文档

    一个使用getElementsByClassName()的例子 // 查找其class属性值中包含warning的所有元素 var warnings = document.getElementsByClassName.../ 基于属性值选取元素 p[lang="fr"] // 所有语言为fr的元素 *[name="x"] // 所有包含name="x"的属性的元素 // 将选择器进行组合使用 span.fatal.error...// 选择class中包含fatal和error的span元素 span[lang="fr"].warning // 所有使用法语,并且class中包含warning的span元素 // 选择器指定文档结构...C++派生类可以同时从多个基类继承,java不允许多重继承,当继承多个基类的时候,使用,运算符将基类进行分开。...将文档看成Element对象树,忽视部分文档,text和comment文档(回车,空格,以及注释节点) Element的children属性 第一部分是Element(通用基类)的children属性

    2.7K20

    网站优化之静态资源优化

    (x 描述符:表示图像的设备像素比) 逐步加载图像      • 使用统一占位符      • 使用 LQIP      • 低质量图像占位符(Low Quality Image Placeholders...)      • 安装:npm install lqip • 源码:https://github.com/zouhir/lqip-loader     • 使用 SQIP • 基于 SVG 的图像占位符...http 或者 https,如果URL的协议头和当前页面的协议头一致的,或者此 URL 在多个协议头都是可用的,则可以考虑删除协议头      • 删除多余的空格、换行符、缩进和不必要的注释      ..."#FFF" : "#000" );      • 尽量避免使用通配选择器 , body > a {font-weight:blod;}      • 尽量避免类正则的属性选择器 , *= , |=,...• 避免频繁设置样式,最好把新 style 属性设置完成后,进行一次性更改      • 避免使用引起回流/重绘的属性,最好把相应变量缓存起来   JavaScript      • 最小化回流和重排

    2.2K10
    领券