是否可以将样式更改应用于对象的特定值？

debugcn 发表于 Dev

JLeno46

我有 ap 显示特定鼠标事件的数十种不同文本。是否可以仅以不同的样式显示其中一个文本？

我做了一个改变 p.style.attributes 的函数，但是这个函数必须在每次 p 中的文本改变时触发，所以我问是否有更流畅的方法来做到这一点。可以给一个值赋予风格吗？

让我们举个明确的例子：

var text32 = "this text should be in blue and huge"

是否可以为这样的 var 赋予样式值？

尼米特·沙阿

您可以class在您想要的任何文本上添加文本更改。我在下面创建了一个简单的例子，我p在点击时更改标签的文本并在第三个上显示不同的样式。同样，这只是一个简单的例子，诀窍是您可以随时更改Class。

请参阅下面的片段：

var pTag = document.getElementById("pTag");
var currentIndex = 0;

var pText = ["This is Text 1", "This is Text 2", "This is Text 3", "This is Text 4", "This is Text 5"];
var pBold = [false, false, true, false, false];


pTag.addEventListener("click", function(){
	currentIndex++;
	
  if(currentIndex >= pText.length)
  	currentIndex = 0;
    
  pTag.innerHTML = pText[currentIndex];
  
  if(pBold[currentIndex])
    pTag.classList.add("redBold");
  else
  	pTag.classList.remove("redBold");
})

p{
  cursor: pointer;
  user-select:none;
}
.redBold{
    color:red;
    font-weight: bold;
}

span{
  font-style: italic;
}

<p id="pTag">Click Me!!!!!!</p>

<span>On click of Above p ("Click Me!!!!!"), it will change the text. When the text will be 'This is Text 3', it should be in Red and Bold.</span>

你也可以在这里测试。

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。