当媒体类型= print时,我正在使用CSS文件,它会将链接地址附加到每个链接的内容中。外部页面的绝对链接没有问题,但是与我网站上的其他页面的相对链接存在问题,这些链接并不总是在链接的同一文件夹级别。
到目前为止:
我已经确定了我想要显示的链接:
$(".TreasuryLink").each(function(i) {
var thisLink = $(this).attr('href');
});
我的问题再一次是检索链接可能会在网站文件结构中的不同级别的完整网址,例如
<a href="../../anotherpage.html">
答案 0 :(得分:3)
你可以将它缩小到这样的相对链接:
a [href ^ =&#34; /&#34;]:{after { 内容:&#34; (http://www.example.com&#34; attr(href)&#34;)&#34; !重要;}
我知道我没有时间回顾我的代码并找到所有相关链接来添加类!
答案 1 :(得分:1)
您总是可以在CSS样式表中定义它。尝试以下风格:
@media print{
a:after{content:" (" attr(href) ")"}
}
这将在括号中的链接之后直接添加链接的href
值。理论上,您可以在该规则上添加其余路径,因此它看起来像这样:
@media print{
a:after{content:" (http://www.domain.com/" attr(href) ")"}
}
但是,这会以相同的方式影响所有超链接(除非您使用CSS以不同方式选择某些a
元素)。这意味着,如果您混合使用完整链接和部分链接,则必须制作一些不同的类或以不同方式选择这些a
标记。
从您的示例代码中,您可以这样做:
@media print{
a.TreasuryLink:after{content:" (http://www.domain.com/" attr(href) ")"}
}
但是,如果您使用../../file.html
之类的路径,这也行不通。您需要将这些网址更改为/path/to/file.html
,我认为这样会更好。
最终结果将使其在页面的打印版本上看起来像这样:
点击这里与我们联系! (http://www.domain.com/contact.html)