1

的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，但我不知道如何使用它来使用伪类。我应该使用什么类名（和/或代码）？

4

1 回答 1

0

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

其次，您不能直接分配像:last-child. 在 CSS 中具有此类伪类的选择器用于定位 DOM 树中其父级的最后一个子级元素。

于 2013-08-11T13:59:42.353 回答