使用CSS插入链接

我手动维护HTML文档，并且正在寻找一种方法来自动在表格中的文本周围插入链接。让我来举例说明：使用CSS插入链接

<table><tr><td class="case">123456</td></tr></table>

我想自动在一个TD每个文本带班“情况”的链接，在我们的bug跟踪系统（顺便说一下，是FogBugz的），这种情况下。

所以我想的是“123456”要改变这种形式的链接：

<a href="http://bugs.example.com/fogbugz/default.php?123456">123456</a>

这可能吗？我已经玩过：之前和之后：伪元素，但似乎没有办法重复案例编号。

来源

2008-10-02 Schof

你是什么意思自动？您需要在HTML上运行一些应用程序，将其转换为所需的结果。 – azamsharp 2008-10-02 23:48:54

不适用于跨浏览器的方式。你可以，但是，做一些比较琐碎的Javascript ..

function makeCasesClickable(){ 
    var cells = document.getElementsByTagName('td') 
    for (var i = 0, cell; cell = cells[i]; i++){ 
     if (cell.className != 'case') continue 
     var caseId = cell.innerHTML 
     cell.innerHTML = '' 
     var link = document.createElement('a') 
     link.href = 'http://bugs.example.com/fogbugz/default.php?' + caseId 
     link.appendChild(document.createTextNode(caseId)) 
     cell.appendChild(link) 
    } 
}

你可以用一些应用它像onload = makeCasesClickable，或者干脆包括它的权利在页面的末端。

来源

2008-10-02 23:47:27 Dan

小心谨慎地将这些TD内容封装在链接中;块级元素可能会出现，并且它们在A标签内无效。此外，我会找到合适的表格并获取其子元素，而不是仅仅获取文档中的所有TD。 – 2008-10-03 04:27:49

不可能使用CSS，再加上这不是CSS的任何方式。客户端Javascript或服务器端（插入语言的选择）是要走的路。

来源

2008-10-02 23:50:47 da5id

我不认为这是可能的CSS。 CSS只会影响内容的外观和布局。

这似乎是一个PHP脚本（或其他语言）的工作。如果你想要一个

<table><tr><td class="case"><?php echo case_link('123456'); ?></td></tr></table>

和：你没有提供足够的信息让我知道做到这一点的最好办法，但也许是这样的：

function case_link($id) { 
    return '<a href="http://bugs.example.com/fogbuz/default.php?' . $id . '">' . $id . '</a>'; 
}

再后来在文档中。 html文件，只需从命令行运行脚本并将输出重定向到.html文件即可。

来源

2008-10-02 23:52:09

这里是专门针对你的HTML一个jQuery解决方案发布：

$('.case').each(function() { 
    var link = $(this).html(); 
    $(this).contents().wrap('<a href="example.com/script.php?id='+link+'"></a>'); 
});

本质

，在每个元素。病例，会抢了元素的内容，并把它们扔到缠着链接。

来源

2008-10-03 00:03:26 Owen

你可能有这样的事情（使用Javascript）。里面<head>，有

<script type="text/javascript" language="javascript"> 
    function getElementsByClass (className) { 
    var all = document.all ? document.all : 
     document.getElementsByTagName('*'); 
    var elements = new Array(); 
    for (var i = 0; i < all.length; i++) 
     if (all[i].className == className) 
     elements[elements.length] = all[i]; 
    return elements; 
    } 

    function makeLinks(className, url) { 
    nodes = getElementsByClass(className); 
    for(var i = 0; i < nodes.length; i++) { 
     node = nodes[i]; 
     text = node.innerHTML 
     node.innerHTML = '<a href="' + url + text + '">' + text + '</a>'; 
    } 
    } 
</script>

，然后在<body>

<script type="text/javascript" language="javascript"> 
    makeLinks("case", "http://bugs.example.com/fogbugz/default.php?"); 
</script>

我测试过它的结束，并能正常工作。

来源

2008-10-03 00:06:56

-3

我知道这是一个老问题，但我偶然发现了这个帖子寻找创建使用CSS超链接的解决方案，并最终使我自己，可能是跨越了这个问题的人磕磕绊绊，像我一样的兴趣：

这里是调用的PHP函数 '连接器（）;'，使假的CSS属性

连接： 'url.com';

#id定义的项目。只是让PHP调用这个你认为链接值得的每一项HTML。输入是.css文件作为字符串，使用：

$ style_cont =的file_get_contents（$ style_path）;

和相应项目的#id。下面有整个事情：

function linker($style_cont, $id_html){ 

    if (strpos($style_cont,'connect:') !== false) { 

     $url; 
     $id_final; 
     $id_outer = '#'.$id_html; 
     $id_loc = strpos($style_cont,$id_outer);  

     $connect_loc = strpos($style_cont,'connect:', $id_loc); 

     $next_single_quote = stripos($style_cont,"'", $connect_loc); 
     $next_double_quote = stripos($style_cont,'"', $connect_loc); 

     if($connect_loc < $next_single_quote) 
     { 
      $link_start = $next_single_quote +1; 
      $last_single_quote = stripos($style_cont, "'", $link_start); 
      $link_end = $last_single_quote; 
      $link_size = $link_end - $link_start; 
      $url = substr($style_cont, $link_start, $link_size); 
     } 
     else 
     { 
      $link_start = $next_double_quote +1; 
      $last_double_quote = stripos($style_cont, '"', $link_start); 
      $link_end = $last_double_quote; 
      $link_size = $link_end - $link_start; 
      $url = substr($style_cont, $link_start, $link_size); //link! 
     } 

     $connect_loc_rev = (strlen($style_cont) - $connect_loc) * -1; 
     $id_start = strrpos($style_cont, '#', $connect_loc_rev); 
     $id_end = strpos($style_cont,'{', $id_start); 
     $id_size = $id_end - $id_start; 
     $id_raw = substr($style_cont, $id_start, $id_size); 
     $id_clean = rtrim($id_raw);        //id! 

     if (strpos($url,'http://') !== false) 
     { 
      $url_clean = $url; 
     } 
     else 
     { 
      $url_clean = 'http://'.$url; 
     }; 

     if($id_clean[0] == '#') 
     { 
      $id_final = $id_clean; 

      if($id_outer == $id_final) 
      { 
       echo '<a href="'; 
       echo $url_clean; 
       echo '" target="_blank">'; 
      }; 
     }; 
    }; 
};

这也许可以提高/使用像.wrap（）或的getElementById（）命令缩短，因为它仅产生<a href='blah'>部，但看到</a>没有开口子句无论如何消失它如果你只是将它们添加到其他地方，仍然有效：D

来源

2013-06-25 15:09:00 piethh

使用CSS插入链接

回答

相关问题