Chrome：动态创建<style>标记没有内容？

尝试编写跨浏览器脚本时遇到了一个奇怪的问题。基本上我的头看起来像这样Chrome：动态创建<style>标记没有内容？

<html> 
<head> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
</head>

然后在身体标记：

<p id="hey">Hey</p> 
<input type="button" value="attachStyle" name="attachStyle" onclick="attachStyle();"></input> 
<script> 
function attachStyle() { 
    var strVar=""; 
    strVar += "<style type='text\/css'>#hey {border:5px solid red;}<\/script>"; 
    $("head").append(strVar); 
} 
</script>

按钮在Firefox工作，但无法在Chrome。当我看着在开发者工具中的HTML DOM元素，风格标签插入但没有内容，就像这样：

<html> 
<head> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<style type='text/css'></script> 
</head>

我很好奇，是什么原因造成的？以及如何以跨浏览器的方式创建CSS样式？谢谢！

来源

2010-05-04 Dan7

<style type='text/css'></script>

您从一个“样式”标签开始，并用“脚本”关闭它。错误的标签！：P

来源

2010-05-04 10:37:11

神圣莫里...并想我花了20分钟试图隔离问题，做一个新的HTML文件，测试它，然后格式化代码和帖子，没有意识到这一点。我现在感到如此愚蠢。但谢谢指出。我拥有。 =]我投票结束这个问题。或者我应该删除它？ – Dan7 2010-05-04 10:42:06

保持它，它会显示其他人搜索，有时你只需要仔细阅读你的代码:) – Kyle 2010-05-04 10:49:11

Chrome：动态创建<style>标记没有内容？

回答

相关问题