gpt4 book ai didi

javascript - 如何创建一个脚本来自动 HTML 中的链接交换?

转载 作者:行者123 更新时间:2023-12-03 01:53:09 24 4
gpt4 key购买 nike

我正在对一个页面上有数百个链接的系统进行维护,如下所示:

<li> Revista alvo <a href="http://exemplo.com"> http://exemplo.com </a> </li>

请注意,a 标记之外有文本。我想要做的是,将此文本与您假定的 href 一起放入 a 标记内,上面的示例如下所示:

<li> <a href="http://exemplo.com"> Revista alvo </a> </li>

我正在手工进行此更改,但有成百上千的链接,这使得任务很累。有谁知道我如何编写脚本来做到这一点?它可以是任何语言,PHPJS 等。

最佳答案

如您所见,文本是 HTML 格式,因此您可以轻松编辑 HTML 文件并使用 将更改应用到 像下面这样:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>


</head>
<body>
<ul id="linksList">
<li> Revista alvo <a href="http://exemplo.com"> http://exemplo.com </a> </li>
<li> Revista alvo <a href="http://exemplo.com"> http://exemplo.com </a> </li>
<li> Revista alvo <a href="http://exemplo.com"> http://exemplo.com </a> </li>
<li> Revista alvo <a href="http://exemplo.com"> http://exemplo.com </a> </li>
<li> Revista alvo <a href="http://exemplo.com"> http://exemplo.com </a> </li>
<li> Revista alvo <a href="http://exemplo.com"> http://exemplo.com </a> </li>
<li> Revista alvo <a href="http://exemplo.com"> http://exemplo.com </a> </li>
<li> Revista alvo <a href="http://exemplo.com"> http://exemplo.com </a> </li>
<li> Revista alvo <a href="http://exemplo.com"> http://exemplo.com </a> </li>
<li> Revista alvo <a href="http://exemplo.com"> http://exemplo.com </a> </li>
<li> Revista alvo <a href="http://exemplo10.com"> http://exemplo.com </a> </li>

</ul>
<a href="#" id="changeIt">Change</a>
<script>
$(document).ready(function(){
$("#changeIt").click(function(){
$("#linksList li").each(function(){
txt = $(this).text().split(' http://')[0].trim();
lnk = $(this).children('a').text(txt)
$(this).html(lnk)
})
})
})
</script>
</body>
</html>

编辑应包括,

  1. 包含 jquery
  2. 为包含 liulol 提供 id
  3. 使用后一个 script 标记中提供的代码,该代码将列表的给定 ID 视为 linksList
  4. 带有 ID changeIt 的 HTML 链接来调用代码。

This is an Online demo

关于javascript - 如何创建一个脚本来自动 HTML 中的链接交换?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50339387/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com