【问题标题】:jQuery dynamic HTML attributes overwriting scriptjQuery 动态 HTML 属性覆盖脚本
【发布时间】:2018-02-27 12:53:23
【问题描述】:

几天来,我一直在努力使用 jQuery 编写一个脚本来替换论坛聊天框中动态创建的 span 样式颜色。
这两个元素都被包裹在带有class="chat"td 元素和带有style="color:green" 的span 中,就像这样

<td class="chat"><span style="color:darkgreen;">test</span></td>

例如,我尝试编写的脚本(可悲的是没有用);

$(".chat:contains('darkgreen')").css("color", "rgb(255, 111, 7)");
$(".chat:contains('darkgreen')").css("font-weight", "bold");
$(".chat:contains('darkgreen')").css("text-shadow", "bold");
$(".chat:contains('darkgreen')").css("text-shadow", "rgb(0, 0, 0) 1px 1px 1px");
$(".chat:contains('darkgreen')").css("text-shadow", "rgb(255, 111, 7) 1px 0px 6px");

我也尝试过使用其他一些类(如tdchat)来更改“聊天”类,但它们都不起作用,任何想法即使在新的 @ 之后如何使它与 jQuery 一起使用聊天框正在生成 987654328@ & 类以使用我的 CSS 更改其所需的跨度颜色?

【问题讨论】:

  • 缺少一个点:$(".chat:contains - 也可以试试$(".chat&gt;span[style='color:darkgreen;']")
  • 我尝试在该类上添加一个点,也请原谅我在最后三行末尾缺少三个分号,但它仍然不起作用。

标签: jquery css contains dynamic-html


【解决方案1】:

你可以通过

$(".chat>span[style='color:darkgreen;']")
.css({
  "color":"rgb(255, 111, 7)",
  "font-weight": "bold",
  "text-shadow": "bold",
  "text-shadow": "rgb(0, 0, 0) 1px 1px 1px",
  "text-shadow": "rgb(255, 111, 7) 1px 0px 6px"
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td class="chat"><span style="color:darkgreen;">test</span></td>
  </tr>
</table>

【讨论】:

  • 试过你写的脚本,但它没有改变任何东西,我正在使用 Tampermonkey 来应用 jQuery 代码,会不会是我定位的 URL 不正确?刷新页面我有时会尝试应用代码来更改颜色,但这种情况很少发生,每当我在聊天框中输入内容时,效果都会丢失,并且不会覆盖新的跨度。
  • 更新:您的代码似乎运行得非常好,唯一剩下的问题是脚本本身并不总是将更改应用于网页,刷新它或切换到另一个聊天选项卡会失去整体效果,并且在聊天框中生成新消息后,jQuery 脚本不会对其应用更改。
  • 您需要发布更多代码来显示您何时以及如何应用它。您需要使用委托来应用它
  • 我设法修复了代码,我所要做的就是修复正确的目标元素,然后它会在不使用委托的情况下正常执行脚本,谢谢您的解决方案!
猜你喜欢
  • 1970-01-01
  • 2016-12-22
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-11-06
  • 2016-01-11
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多