createElement和伪类

时间:2013-08-11 13:53:02

标签: javascript

css

div.online:last-child {
    color:green;
}

div.offline:last-child {
    color:green;
}

javascipt的

var x=navigator.onLine; 
var div = document.createElement("div"); 
if (x==false) {
    var divContent = document.createTextNode("sorry, you're offline"); 
    divContent.className="offline:last-child";
    div.appendChild(divContent);
    var k = document.body.appendChild(div);
} else {
    var divContent = document.createTextNode("you are online");
    divContent.className="online:last-child";
    div.appendChild(divContent);
    var k = document.body.appendChild(div);
}

这里我使用.className来改变使用last-child伪类的最后一个单词的样式(因此只对离线和在线进行样式化)。我猜我的js代码中的类命名存在问题。 在我采用这种方法之前,我使用了setAttribute,但我不知道如何使用伪类。我应该使用什么类名(和/或代码)?

1 个答案:

答案 0 :(得分:0)

首先,您不能将类分配给文本节点,只能分配给元素。将在线或离线课程分配给div,而不是其文本内容。

其次,你不能直接指定像:last-child这样的伪类。 CSS中具有此类伪类的选择器用于在DOM树中定位其父级的最后一个子元素。