好的,所以我基本上有一个 HTML 页面,上面有两个图像。然后,用户可以单击其中一个图像,它将带您进入下一页。每张图片都会将您带到相同的下一页,但根据您选择的图片,它会更改配色方案。
这是我用于它的 HTML:
<a href="LetterFromEditor.html" onclick="changeCSS('stylesheet1.css', 0);"><img class="cover" src="cover1.png" /></a>
<a href="LetterFromEditor.html" onclick="changeCSS('stylesheet2.css', 0);"><img class="cover" src="cover2.png" /></a>
然后调用以下脚本:
function changeCSS(cssFile, cssLinkIndex)
{
var oldlink = document.getElementsByTagName("stylesheet1.css").item(cssLinkIndex);
var newlink = document.createElement("stylesheet2.css")
newlink.setAttribute("rel", "stylesheet");
newlink.setAttribute("type", "text/css");
newlink.setAttribute("href", cssFile);
document.getElementsByTagName("head").item(0).replaceChild(newlink, oldlink);
}
但是,这似乎并没有改变任何东西,它与原来的一组样式表保持一致。
我还需要找到一种使用 cookie 的方法,以便在您转到下一页而不是返回原始页面时知道哪个用户选择了。