javascript - Chrome 扩展仅在具有特定内容的类上注入(inject) css

标签 javascript html css google-chrome google-chrome-extension

<分区>

我知道如何将 CSS 注入(inject)网页并更改某个类,但如果我不想更改所有该类怎么办?

例如,假设我有一个 div:

<div class="content">
   <p> My favorite color is yellow </p>
</div>
<div class="content">
   <p> My favorite color is green </p>
</div>

我想使用内容脚本来编辑 .content 类的 CSS,但仅限那些包含关键字 "green"

我是否必须使用 Javascript,如果是,我该怎么做?

最佳答案

如果您愿意使用 jQuery,您可以使用 :contains() selector .

示例

$(".content:contains('green')").css("color", "green");
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="content">
  <p>My favorite color is yellow</p>
</div>
<div class="content">
  <p>My favorite color is green</p>
</div>

关于javascript - Chrome 扩展仅在具有特定内容的类上注入(inject) css,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42044742/

上一篇:css - 按钮字体悬停颜色默认为站点 A 悬停颜色

下一篇:css 关键帧每一步都会停止一秒钟

相关文章:

javascript - 如何使用 JavaScript/JQuery 在面向公众的 ASP.NET 网站上使用 SP2013 REST API?

html - 好像不能点击搜索

html - 侧导航栏延伸至底部

javascript - 从选择选项中获取文本

javascript - 替换html/javascript中可以替换的div

javascript - 无法根据条件更改输入背景

javascript - 在小 Canvas 上绘制的大图像变得模糊

html - 在新的 chrome (44.0.2403.157) 中,地理定位不起作用

css - 什么是好的 CSS 清理工具?

html - div 内 h1 元素的边距