我有一个html,我想解析它的特定节点并更改其内容,同时将新节点值的字体样式设置为斜体。我可以解析到特定的nodevalue,但无法了解如何更改nodevalue的字体样式。
如果我的问题
<html>
<head>
<script src="potrait.js"></script>
</head>
<body>
<p class="q">Here comes the count</p>
<ul class="q">
<li><p class="q" align="center">1</p></li>
</ul>
</body>
</html>
我想把"1"改成一(某物),(某物)应该是斜体。
我使用下面显示的DOM方法直到1
var list=document.getElementsByTagName('ul')
list[0].firstChild.nextSibling.childNodes[0].firstChild.nodeValue = "one(something)")
我可以更改内容,但我不知道如何将(某些内容)更改为斜体。
任何指导都是非常可观的。。!!
简单地用斜体标记包装"(something)"
var list=document.getElementsByTagName('ul')
list[0].firstChild.nextSibling.childNodes[0].firstChild.nodeValue = "one<i>(something)</i>")
您可以使用.innerHTML
和<i>
:
var list=document.getElementsByTagName('ul');
var p = list[0].firstElementChild.firstElementChild;
p.innerHTML = "one<i>(something)</i>";
您可以使用jQuery轻松处理此问题。代码为:
$("ul li p:first").html("one<i>(something)</i>");
这意味着取ul中lihtml标记中的第一个p标记,并将其html内容更改为one<i>(something)</i>
。我为您制作了一个Plunker演示。
请小心,因为此代码将替换网页上列表中的所有第一个元素,其中它有一个p标记。为了避免这种情况,您可以为您想要的ul分配一个类。例如,代码中的列表已经有一个名为q的类,因此代码看起来像:
$(".q :first").html("one<i>(something)</i>");
编辑:要获得特定的子项(不是第一个),可以使用:nth-child(<number of child>)
而不是:first
。有关演示,请参阅jQuery文档。