IE 11 将伪内容视为元素内容的一部分答案

【问题标题】：IE 11 considers pseudo content as part of element contentIE 11 将伪内容视为元素内容的一部分
【发布时间】：2014-10-15 14:18:30
【问题描述】：

我遇到了一个没有可靠解决方案的问题，除了使用data-attributes 创建解决方法。但是，我发现我遇到的行为非常奇怪，想知道是否有更好的解决方法。

考虑以下代码：

HTML

<div id="test">This is a test!</div>

CSS

#test:after
{
    content: "...This shouldn't be part of text()!";
}

$(document).ready(function () {
    $(document).on("click", "#test", function () {
        alert($(this).text());
    });
});

我正在处理的问题是 IE 11 似乎将 :after 伪选择器中的内容作为 div 中内容的一部分。这意味着当点击 div 时，IE 11 会显示一条警告信息：

This is a test!...This shouldn't be part of the text()!

但是，我期待一个警报说：

This is a test!

Firefox 和 Chrome 都显示后一个警报。我想知道是否可以让 IE 也显示后一个警报而不使用额外的 data--attributes 或类似的东西。

这是一个 FIDDLE 用于此示例。

【问题讨论】：

它在 IE9 和 IE10 中完美运行！
Internet Explorer 11 目前充满了这种错误。只需强制它以兼容模式启动
为我工作：IE 11.0.9600
@strah 真的吗？？我在 IE 11.0.9600.16384 中测试了我的小提琴，但它不工作......
@dippas 至少很高兴知道 :) 现在对于 IE 11...这似乎对 strah 有效...

标签： jquery internet-explorer-11 pseudo-element

【解决方案1】：

尝试将 .text() 更改为 .html()，例如：Here。它在 IE 11.0.9600.17351 上运行良好（使用你的版本和这个版本）

代码：

$(document).ready(function () {
    $(document).on("click", "#test", function () {
        alert($(this).html());
    });
});

【讨论】：

感谢您的建议，但这对我不起作用。例如，如果文本包含在 span 元素中，这些标签也会显示，这是我不想要的。但是，您的解决方案为我提供了替代解决方案，因此我感谢您。 :)

【解决方案2】：

感谢E先生的回答，我想到了一个可能的解决方案。我可以通过获取html() 来获取内容，然后将其重新包装在一个虚拟div 中，我再次从中获取text()。对于如此简单的事情，似乎需要做很多事情，但它确实有效。

HTML

<div id="test"><span>This is a test!</span></div>

$(document).ready(function () {
    $(document).on("click", "#test", function () {
        var html = $(this).html();
        var text = $("<div />").html(html).text();
        alert(text);
    });
});

查看此更新FIDDLE。

【讨论】：