2 
<style>
<script>
var screenW = 640, screenH = 480;
if (parseInt(navigator.appVersion)>3) {
    screenW = screen.width;
    screenH = screen.height;
}
else if (navigator.appName == "Netscape" 
&& parseInt(navigator.appVersion)==3
&& navigator.javaEnabled()
) 
{
    var jToolkit = java.awt.Toolkit.getDefaultToolkit();
    var jScreenSize = jToolkit.getScreenSize();
    screenW = jScreenSize.width;
    screenH = jScreenSize.height;
}

document.write(
".wrap, html {font-family: 'PT Sans', sans-serif;     width:"+screenW+"px;height:"+screenH+"px;}"
)
</script>
</style>

该脚本旨在将用户的屏幕尺寸添加到这个简短的 CSS 片段的高度和宽度参数中，我已在内部包含该片段，缺少使用外部样式表执行此操作的方法。

我很乐意学习一种新的、更有效的方法。然而，我的官方问题是，这个脚本会起作用吗？

http://www.javascripter.net/faq/screensi.htm是我从中获取的页面位置！

4

1 回答 1

1

我使用 XHTML 完成了这项工作（如果它在 XHTML 中工作，它在 HTML 中工作，但 99.9% 的时间不是反之亦然）所以你知道你在这里得到了一个高质量的例子。

首先，您不要让脚本元素成为样式元素的子元素。

其次，永远不要在 body 元素中放置脚本元素，除非您想对后续工作造成严重损害。

永远不要使用document.write它，因为它与 XHTML 不兼容，或者innerHTML将代码视为文本字符串而不是代码，这意味着当您尝试更改转储到 DOM 中的内容时，它可能会或可能不会起作用，因为您可能指的是代码，或者您可能指的是看起来像代码的文本。

将以下内容另存为example.xhtml，然后在 Firefox 中打开。我建议使用 Firebug 的检查器查看 DOM，以便您可以看到链接元素引用带有 screen_height 和 screen_width 的样式表可以在您最后确认。随意问我任何（理智的）问题。

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Example</title>
<script type="application/javascript">
//<![CDATA[
function load_css()
{
 var l = document.createElement('link');
 l.setAttribute('href','themes/example/style.css?screen_height='+encodeURIComponent(screen.height)+'&screen_width='+encodeURIComponent(screen.width));
 l.setAttribute('rel','stylesheet');
 l.setAttribute('title','example');
 l.setAttribute('type','text/css');
 document.getElementsByTagName('head')[0].appendChild(l);
}

window.onload = function()
{
 load_css();
}
//]]>
</script>
</head>
于 2013-09-16T05:14:33.790 回答