使用 waitForKeyElements 用 span 包裹文本会破坏样式吗?
Wrapping text with a span, using waitForKeyElements, is killing the styling?
我正在使用 Greasemonkey 和 waitForKeyElements()
更改网页中的一些文本。
这是单个 jNode 元素的示例。
<div class="Ov-h Mx-a">
<div>
<div class="Grid-bind-end">
<div class="ysf-player-name Nowrap Grid-u Relative Lh-xs Ta-start">
<a class="Nowrap" href="http://sports.yahoo.com/nfl/players/7206" target="sports">H. Miller</a> <span class="Fz-xxs">Pit - TE</span>
</div>
</div>
<div class="Grid-bind-end">
<span class="ysf-player-status F-injury Fz-xxs Grid-u Lh-xs"></span>
<div class="ysf-player-detail Nowrap Grid-u Fz-xxs Lh-xs Ta-start">
<span class="ysf-game-status"><a class="F-reset" href="http://sports.yahoo.com/nfl/pittsburgh-steelers-new-england-patriots-20150910017/" onclick="pop(this)" target="sports">Thu 5:30 pm @ NE</a></span>
</div>
</div>
</div>
</div>
我想把Thu 5:30 pm @ NE
改成Thu 5:30 pm @ < span class="color">NE - [rank]</span>
(注意[rank]是我有的一个变量)
这是我试过的
jNode.text((jNode.text().replace("NE","<span class='color'>NE - [rank]</span>")))
但这会使元素失去其样式。
目前,您只获取 <div class="Ov-h Mx-a">
中整个节点树的文本("H. Miller Pit - TE" 等)并将其用作新内容,丢弃 [=] 中所有现有的 html 布局24=].
正确的方法一般是仅更改相关元素的内容,以避免重新创建同级元素(以便事件监听器附加addEventListener
或on
继续研究它们)并使用 .html()
(因为你要添加 html):
var link = jNode.find(".F-reset");
link.html(link.html().replace("NE","<span class='color'>NE - [rank]</span>"));
我正在使用 Greasemonkey 和 waitForKeyElements()
更改网页中的一些文本。
这是单个 jNode 元素的示例。
<div class="Ov-h Mx-a">
<div>
<div class="Grid-bind-end">
<div class="ysf-player-name Nowrap Grid-u Relative Lh-xs Ta-start">
<a class="Nowrap" href="http://sports.yahoo.com/nfl/players/7206" target="sports">H. Miller</a> <span class="Fz-xxs">Pit - TE</span>
</div>
</div>
<div class="Grid-bind-end">
<span class="ysf-player-status F-injury Fz-xxs Grid-u Lh-xs"></span>
<div class="ysf-player-detail Nowrap Grid-u Fz-xxs Lh-xs Ta-start">
<span class="ysf-game-status"><a class="F-reset" href="http://sports.yahoo.com/nfl/pittsburgh-steelers-new-england-patriots-20150910017/" onclick="pop(this)" target="sports">Thu 5:30 pm @ NE</a></span>
</div>
</div>
</div>
</div>
我想把Thu 5:30 pm @ NE
改成Thu 5:30 pm @ < span class="color">NE - [rank]</span>
(注意[rank]是我有的一个变量)
这是我试过的
jNode.text((jNode.text().replace("NE","<span class='color'>NE - [rank]</span>")))
但这会使元素失去其样式。
目前,您只获取 <div class="Ov-h Mx-a">
中整个节点树的文本("H. Miller Pit - TE" 等)并将其用作新内容,丢弃 [=] 中所有现有的 html 布局24=].
正确的方法一般是仅更改相关元素的内容,以避免重新创建同级元素(以便事件监听器附加addEventListener
或on
继续研究它们)并使用 .html()
(因为你要添加 html):
var link = jNode.find(".F-reset");
link.html(link.html().replace("NE","<span class='color'>NE - [rank]</span>"));