选择：在伪类/元素之后 [英] Select :after pseudo class/element
问题描述
在CSS中，我使用 body：after 添加内容后，我想在jQuery中获取其高度。我该怎么办？
我阅读了查找内容，例如以下示例：
<！DOCTYPE html PUBLIC - // W3C // DTD XHTML 1.0 Transitional // ENhttp：// www .w3.org / TR / xhtml1 / DTD / xhtml1-transitional.dtd>
< html xmlns =http://www.w3.org/1999/xhtmlxml：lang =enlang =en>
< head>
< title>选择：after伪类/元素< / title>
< style type =text / css>
#msg：after {
content：World！
}
< / style>
< script type =text / javascript>
window.onload = function（）{
if（window.getComputedStyle）{
var element = document.getElementById（msg）;
var style = window.getComputedStyle（element，'：after'）
alert（style.content）;
}
else {
alert（This browser sucks！）; //;）
}
}
< / script>
< / head>
< body>
< h1>
< span id =msg>您好< / span>
< / h1>
< / body>
< / html>
...不幸的是，这可让您访问内容到高度：（
In CSS, I have used body:after to add content, I want to in jQuery get its height. How might I do that?
I read from here such pseudo elements are for modifications and thus unselectable? I seem to be unable to even use $("body > :last-child") to select the last child which should be the :after?
Note that the content you add using :after and content isn't a node - it isn't either an element nor text in your document. You can see this with FireBug: in this screenshot, my HTML contains the word "hello" but the word "world!" is added using CSS:
What you can do is use getComputedStyle to find out what the content is, like the following example:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" >
<head>
<title>Select :after pseudo class/element</title>
<style type="text/css">
#msg:after {
content:" World!"
}
</style>
<script type="text/javascript">
window.onload = function() {
if(window.getComputedStyle) {
var element = document.getElementById("msg");
var style = window.getComputedStyle(element,':after')
alert(style.content);
}
else {
alert("This browser sucks!"); // ;)
}
}
</script>
</head>
<body>
<h1>
<span id="msg">Hello</span>
</h1>
</body>
</html>
... unfortunately, this gives you access to the content but not to the height :(
这篇关于选择：在伪类/元素之后的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
