Javascript函数无法访问CSS样式
Javascript函数无法访问CSS样式 我不明白为什么下面的Javascript函数无法访问任何CSS样式！演示脚本的 其想法是在鼠标右键单击时，在鼠标坐标处显示一个选项小菜单。代码如下Javascript函数无法访问CSS样式,javascript,Javascript,Javascript函数无法访问CSS样式 我不明白为什么下面的Javascript函数无法访问任何CSS样式！演示脚本的 其想法是在鼠标右键单击时，在鼠标坐标处显示一个选项小菜单。代码如下 <style type="text/css"> .MiniMenuText { Font-family: "Comic Sans MS"; Font-size: 11px; Font-weight: Normal; Fon
<style type="text/css">
.MiniMenuText {
Font-family: "Comic Sans MS";
Font-size: 11px;
Font-weight: Normal;
Font-style: Normal;
Text-decoration: None;
Text-align: Left;
Color: #FFFFFF;
Height:0;}
.MiniMenuBox {
-moz-box-shadow: 3px 3px 4px #000;
-webkit-box-shadow: 3px 3px 4px #000;
box-shadow: 3px 3px 4px #000;
Padding: 1px;
Width: 175px;
Height: 80px;
Background-color: #686868;
Border-style: Solid;
Border-color: #A0AAA0;
Border-width: 1px;
Text-align: Center;}
<!--
A:hover {Color:Black; Background-color:#FFFFFF;}
-->
</style>
.MiniMenuText{
字体系列：“Comic Sans MS”；
字体大小：11px；
字体大小：正常；
字体风格：普通；
文字装饰：无；
文本对齐：左对齐；
颜色：#FFFFFF；
高度：0；}
.小盒子{
-莫兹盒阴影：3px 3px 4px#000；
-网络工具包盒影：3px 3px 4px#000；
盒影：3px 3px 4px#000；
填充：1px；
宽度：175px；
高度：80px；
背景色：#686868；
边框样式：实心；
边框颜色：#A0AAA0；
边框宽度：1px；
文本对齐：居中；}
函数RunMiniMenu（）{
var X=window.event.clientX；
var Y=window.event.clientY；
文件。写（“”）；
文件。写（“
”）；
文件。写（“
”）；
文件。写（“
”）；
文件。写（“
”）；
文件。写（“”）；
}
一个错误是您在每个HTML属性之后放置。另一个是Michael Berkowski提到的（在主体
标记中缺少的
）
还有一件事需要记住：当您在页面完全加载后（即文档关闭后）写入文档时，写入该文档将生成缺少样式的新文档
编辑
<style>
/* Your styles here */
</style>
...
<body oncontextmenu="runMiniMenu();">
<!-- Whatever markup you need comes here! -->
<script type="text/javascript">
function runMiniMenu(e) {
var X = e.clientX,
Y = e.clientY;
var div = document.createElement('div');
div.createAttribute('class', 'MiniMenuBox');
div.createAttribute('style', 'position: absolute; left:'+X+'px ...
for ( var i=1; i < 6; i++ ) {
var a = document.createElement('a');
a.createAttribute('target', '_blank');
// You get the point!
...
div.appendChild(a);
}
document.getElementsByTagName("body")[0].appendChild(div);
return false;
}
</script>
</body>
/*你的风格在这里*/
...
函数runMiniMenu（e）{
var X=e.clientX，
Y=e.clientY；
var div=document.createElement（'div'）；
div.createAttribute（'class'，'MiniMenuBox'）；
div.createAttribute（'style'，'position:绝对；left:'+X+'px。。。
对于（变量i=1；i<6；i++）{
var a=document.createElement（'a'）；
a、 createAttribute（'target'，'u blank'）；
//你明白了！
...
儿童（a）分部；
}
document.getElementsByTagName（“body”）[0].appendChild（div）；
返回false；
}
关于语法错误和document.write，每个人都是正确的。放弃document.write，你会过得更好
如果您只是想在页面加载后将html放入body标记中，那么我将使用innerHTML
所以看起来是这样的：
<script type="text/javascript">
function RunMiniMenu() {
var X=window.event.clientX;
var Y=window.event.clientY;
var body = document.getElementsByTagName("body");
body.innerHTML = "<div class='MiniMenuBox' style='position:absolute; left:"+X+"px;
top:"+Y+"px;'><a href=''; target='_blank'; class='MiniMenuText'>Option 1</a><br/></div>";
}
</script>
<body onload="RunMiniMenu(); return false;"> </body>
函数RunMiniMenu（）{
var X=window.event.clientX；
var Y=window.event.clientY；
var body=document.getElementsByTagName（“body”）；
body.innerHTML=“
”；
}
您的
标记缺少结束标记
我没有收到任何错误，但样式完全丢失！您不能使用文档。在事件处理程序中或加载文档后的任何位置写入。@duri我投票反对文档。完整写入；-）Jan的权利。忘记文档。写。这是个祸根。最好使用众多JavaScript模板库中的一个（我碰巧编写了一个，呵呵=>）。我刚刚测试过，如果我用>关闭body标记，它将不起作用！：）顺便说一句，我还测试了删除；after属性没有什么区别。我知道，这些是浏览器会自动删除的语法错误（不过，你不应该一开始就这么做）。真正的问题是你要再次打开文档，在文档关闭后再对其进行写入谢谢你的代码，我稍后会测试它，因为现在我要赶去参加我妻子的b日聚会了！：）请注意，当右键单击某些按钮时，将调用小菜单。在屏幕上的其他地方，浏览器默认的右键单击菜单功能正常。这就是为什么我没有在寻找事件处理程序等。谢谢，但您的方法返回两个错误：1。未捕获的语法错误：突出显示行“body.innerHTML…”和2的意外标记非法。未捕获引用错误：未定义RunMiniMenu突出显示行“
<script type="text/javascript">
function RunMiniMenu() {
var X=window.event.clientX;
var Y=window.event.clientY;
var body = document.getElementsByTagName("body");
body.innerHTML = "<div class='MiniMenuBox' style='position:absolute; left:"+X+"px;
top:"+Y+"px;'><a href=''; target='_blank'; class='MiniMenuText'>Option 1</a><br/></div>";
}
</script>
<body onload="RunMiniMenu(); return false;"> </body>