Question

我需要在课程module-content之后设置一个带有纯CSS的网址。此代码不起作用，但基本上我需要在Custom‌·Link中设置content: ' ' attr(href);。

<div class="module-content">
   <div class="aidanews2" style="clear: both;">
      <div class="aidanews2_art aidacat_2 aidapage105 hidepiece odd first" style="clear: both; display: block;">
      <div class="aidanews2_art aidacat_2 aidapage105 hidepiece even last" style="clear: both; display: block;">
   </div>
   <div class="aidanews2_bottomlink">
      <a href="/joomla/index.php">Custom‌·Link</a>
   </div>
</div>

.moduletable>.module-content:after{
    background: none repeat scroll 0 0 #050505;
    content: ' ' attr(href);
}

不成功 Jquery 尝试：

var a = $('.aidanews2_bottomlink').html();
var b = $('.top-1 > .moduletable > .module-content:after ').html(a);

Answer 1

使用JavaScript / jQuery可能更容易完成。无论如何，这就是我接近它的方式。

如果我正确理解了您的要求，您希望1）获取链接上的href属性，并且2）在封闭的module-content div上的结束标记之后将其作为文本输出。

可以使用以下代码完成：

//get the text
var content = $(".aidanews2_bottomlink a").attr('href');  

//append it after the containing element
$(".aidanews2_bottomlink").parents(".module-content").eq(0).after(content);

以下是一个实例：http://jsfiddle.net/ANZgE/2/

Answer 2

这就是你的HTML和CSS应该是这样的：

<div class="module-content" data-href="/joomla/index.php">
   <div class="aidanews2" style="clear: both;">
      <div class="aidanews2_art aidacat_2 aidapage105 hidepiece odd first" style="clear: both; display: block;">
      <div class="aidanews2_art aidacat_2 aidapage105 hidepiece even last" style="clear: both; display: block;">
   </div>
</div>

.moduletable > .module-content:after{
    background: none repeat scroll 0 0 #050505;
    content: ' ' attr(data-href);
}

第content: ' ' attr(data-href);行正在元素data-href中寻找属性.module-content。

添加带有css内容的链接href

2 个答案: