新手问题,我正在研究一个简单的场景:使用Tritium更改页面上的背景颜色和给定元素的文本。我的页面如下所示:
<div class="hero" id="hero">
<div id="heroContentShort">
<div class="heroContentShort">
<h1 style="text-transform:capitalize;">My Text<span style="text-decoration:underline;font-weight:bold;"><a href="/pages/new.html" style="color:#FFFFFF">- on Moovweb</a></span></h1>
</div>
</div>
在我的.TS文件中,我有以下内容:
insert("div", class:"cus_title"){
insert("div", class:"cus_row1"){
move_here("//div[@id='hero']/div/div/h1")
attribute("background", "red")
text("My New Text")
}
}
以上是成功更改文本,但不保留任何格式,也不将背景颜色更改为红色。
我做错了什么?
由于
答案 0 :(得分:3)
首先,我强烈建议你不要在氚中着色。 DOM和样式应该是分开的。如果您不想创建自己的页面,我建议您将其放在main.scss
文件的底部。然后你会这样做:
.cus_row1 {
background-color: red;
}
这样可以使背景颜色完美正确地工作。
但是,如果(出于某种原因)你不想在氚中这样做,我会这样做:
insert("div", class:"cus_title"){
insert("div", class:"cus_row1"){
move_here("//div[@id='hero']/div/div/h1")
attribute("style", "background-color: red")
text("My New Text")
}
}
第一个原因是,不推荐使用background属性。其次,用户代理样式表可以覆盖它。我希望这对你有用!