Question

假设我有一个使用location.hash存储页面信息的页面，我的大多数访问者都使用js，所以没有问题。有没有办法使用CSS链接到非JS版本（改为使用location.search）具有相同的值？

想象：

<noscript>Use this page instead</noscript>
<textarea></textarea>
<input id="save" type="checkbox" value="save">
<input id="run" type="checkbox" value="run">

JS：

$(document).ready( function() { $('textarea').val( unescape(location.hash) ) } );
$('#save').click(function() { location.hash = escape($('textarea').val()) });
$('#run').click(function() { /* Mess around with the DOM */ });

我正在考虑以下几点：

noscript:after {
    content: full url with hash with a ? instead of a #
}

我意识到，如果我使用location.search我就不会有问题，但我希望该页面可以与JS的人一起使用，甚至可以离线。

我尝试了背景图片网址但忽略了当前的网页名称。我需要CSS中可以完整访问当前URL的内容。

Answer 1

您无权访问样式表中的当前页面的网址。

你可以去的最远的是CSS3的:target选择器，你可以将内容样式应用于（绝对不是input），attr(id)来获取ID的值如果其ID与URL哈希片段相同。以及表示页面URL的硬编码字符串（它可能在带有<style>标记的内部样式表中工作...）：

/*
If the hash is #save, select [id="save"]
and make its ::after content 'http://example.com/?' followed by its ID.
*/
:target::after { content: 'http://example.com/?' attr(id); }

顺便说一下，你不能使用attr()函数来获取一个元素的ID并将其放在另一个元素中，这就是为什么我说你不能在input元素上使用它。 / p>

以某种方式使用CSS引用哈希值

1 个答案: