Javascript 动态文本操作

在这个站点中，a有很多标题（使用H2），并且希望左半部分使用一种颜色，右半部分使用另一种颜色，用空格分隔，但我无法修改php文件（因为它是CMS），然后，我尝试使用一些Javascript：

var headh2 = document.getElementsByName('head2');
    switch (headh2.innerHTML) {
        case ('first item'):
            headh2.innerHTML = '<span style="color: #022662">first </span> item';
        break;
        case ('second item'):
            headh2.innerHTML = '<span style="color: #022662">second </span> item';
        break;
        default:
            headh2.innerHTML = headh2.innerHTML;
    }

var headh2=document.getElementsByName（'head2'）；
开关（headh2.innerHTML）{
案例（“第一项”）：
headh2.innerHTML='第一项'；
打破
案例（“第二项”）：
headh2.innerHTML='第二项'；
打破
违约：
headh2.innerHTML=headh2.innerHTML；
}

但是，它在任何情况下都不起作用，我需要指定它，但是，不可能这样做：

    var headh2 = document.getElementsByName('head2');
    var X = [abc]; 
    switch (headh2.innerText) {
        case (X[0]+' '+X[1]):
            headh2.innerHTML = '<span style="color: #022662">'+X[0]+'</span>'+X[1];
        break;
        case (X[0]+' '+X[1]+' '+X[2]):
            headh2.innerHTML = '<span style="color: #022662">'+X[0]+'</span>'+X[1]+' '+X[2];
        break;
        default:
            headh2.innerHTML = X[0];
    }
}

var headh2=document.getElementsByName（'head2'）；
var X=[abc]；
开关（headh2.innerText）{
案例（X[0]+''+X[1]）：
headh2.innerHTML=''+X[0]+''+X[1]；
打破
案例（X[0]+''+X[1]+''+X[2]）：
headh2.innerHTML=''+X[0]+''+X[1]+''+X[2]；
打破
违约：
headh2.innerHTML=X[0]；
}
}

其中X是一个没有空格的字符范围，我尝试使用替换方法：

JS:

var headh2=document.getElementsByName（'head2'）.innerHTML；
var-str=头h2；
var n=str.replace（“，”）；
document.getElementsByName（'head2'）。innerHTML=n；

PHP:

但是它不能正常工作，它替换了标题中的所有空格，而不仅仅是我想要的那个

---

提前非常感谢。

这里有一种使用DOM操作的方法。请注意，此项稍作修改，以便对所有

h2

标记执行此操作：

var nodes=document.getElementsByTagName（'h2'）；
对于（var i=0；i1）
second.nodeValue=“”+部分[1]；
其他的
second.nodeValue=“”；
}

现在您可以看到上面的代码。谢谢你的关注。我的回答应该会给你一个想法，但是你对你的问题所做的编辑表明你做的事情与你最初问的完全不同。你想改变什么-永久链接的颜色，永久链接的某些部分，或者标题中单词的颜色？请发布页面部分的HTML，而不是PHP代码。我在JS中使用的部分就是那个PHP部分，就是它，我尝试用一个span标记替换它（样式中有一些颜色），然后用一个2字的标题，它可以工作，因为我将空格替换为“”，然后它取消第一个span，并用其他颜色创建另一个span，在结尾之前有一个“”。我只是想改变标题中一些单词的颜色。谢谢，但是，第三个单词怎么了？效果很好，但是，问题是如果我的标题有9个空格，我会很高兴在第5个空格中，不是在第一个空格中，而是在第3个空格中的5个空格中，明白吗？可能吗？

    var headh2 = document.getElementsByName('head2').innerHTML;
    var str = headh2; 
    var n=str.replace(" ","</span> <span class='color2'>");
    document.getElementsByName('head2').innerHTML=n;

<h2><a href="<?php the_permalink() ?>" rel="bookmark"><span name="head2" class="color1"><?php the_title(); ?></span></a></h2>

var nodes = document.getElementsByTagName('h2');
for(var i = 0; i < nodes.length; i++)
{
  var second = nodes[i].firstChild;
  var parts = second.nodeValue.split(" ", 2);

  var first = document.createElement('span');
  first.appendChild(document.createTextNode(parts[0]));
  first.style.color = "#022662";
  nodes[i].insertBefore(first, second);
  if(parts.length > 1)
    second.nodeValue = " " + parts[1];
  else
    second.nodeValue = "";
}