使用JS实现 数字递增 以生成连续的URL链接

为了生成一个从 https://yiyan.baidu.com/1.html 到 https://yiyan.baidu.com/100.html 的链接列表，并且保持链接中除数字外的其他部分不变。

方法一

Python示例

# 初始化一个空列表来存储链接  
links = []  
  
# 循环从1到100，生成每个链接  
for i in range(1, 101):  # 注意range的结束值是开区间，所以这里用101  
    # 格式化字符串，将i转换为字符串并插入到链接中  
    link = f"https://yiyan.baidu.com/{i}.html"  
    # 将生成的链接添加到列表中  
    links.append(link)  
  
# 打印或处理链接列表  
for link in links:  
    print(link)

这段代码首先创建了一个空列表 links，然后使用一个 for 循环从1迭代到100（包括1和100）。在每次迭代中，它使用字符串格式化（f-string）来创建一个新的链接，其中 i 被转换成字符串并插入到URL的适当位置。然后，这个新生成的链接被添加到 links 列表中。最后，通过一个 for 循环遍历并打印出列表中的每个链接。

这种方法非常灵活，可以根据需要调整URL的模板或循环的范围。如果想要将这些链接保存到文件中，可以使用Python的文件操作功能来实现。例如，可以使用 open 函数和 write 方法将每个链接写入到一个文本文件中。

方法二

在HTML中直接实现数字递增以生成连续的URL链接是不可能的，因为HTML是一种标记语言，用于定义网页的结构和内容，而不是用于处理逻辑或循环。HTML本身不具备编程或脚本能力来动态生成内容。

但是，可以使用JavaScript（一种常用于网页的脚本语言）来实现这一功能。JavaScript可以在用户的浏览器中执行，从而能够动态地修改网页内容。

以下是一个使用JavaScript生成并显示从 https://yiyan.baidu.com/1.html 到 https://yiyan.baidu.com/100.html 的链接列表的示例：

HTML示例

<!DOCTYPE html>  
<html>  
<head>  
    <title>动态链接列表</title>  
</head>  
<body>  
  
<ul id="linksList"></ul>  
  
<script>  
    // 获取用于放置链接的<ul>元素  
    var list = document.getElementById('linksList');  
  
    // 循环从1到100，生成每个链接并添加到列表中  
    for (var i = 1; i <= 100; i++) {  
        // 创建一个新的<li>元素  
        var item = document.createElement('li');  
        // 创建一个<a>元素，并设置其href和文本内容  
        var link = document.createElement('a');  
        link.href = `https://yiyan.baidu.com/${i}.html`;  
        link.textContent = `链接 ${i}`; // 或者你可以直接显示URL作为文本  
        // 将<a>元素添加到<li>元素中  
        item.appendChild(link);  
        // 将<li>元素添加到<ul>列表中  
        list.appendChild(item);  
    }  
</script>  
  
</body>  
</html>

在这个示例中，HTML文档包含了一个空的<ul>元素（ID为linksList），JavaScript代码将遍历从1到100的数字，并为每个数字创建一个新的 <li> 元素和一个 <a> 元素（代表链接）。然后，它将这些元素添加到HTML文档的<ul>列表中。

这样，当用户访问这个HTML页面时，他们将看到一个包含100个链接的列表，每个链接都指向https://yiyan.baidu.com/ 后跟着一个 从1到100的数字 和 .html 后缀的URL。

修改版

去除了<ul>列表，只显示链接。

<!DOCTYPE html>  
<html>  
<head>  
    <title>动态链接换行显示</title>  
</head>  
<body>  
  
<div id="linksContainer"></div>  
  
<script>  
    // 获取用于放置链接的<div>元素  
    var container = document.getElementById('linksContainer');  
  
    // 循环从1到100，生成每个链接并添加到容器中，每个链接后添加一个换行  
    for (var i = 1; i <= 100; i++) {  
        // 创建一个<a>元素  
        var link = document.createElement('a');  
        // 设置链接的href属性  
        link.href = `https://yiyan.baidu.com/${i}.html`;  
        // 设置链接的文本内容（这里直接显示为URL）  
        link.textContent = `链接 ${i}: https://yiyan.baidu.com/${i}.html`;  
        // （可选）如果你想要链接在新标签页中打开，可以设置target属性  
        link.target = '_blank';  
        // 将<a>元素添加到容器中  
        container.appendChild(link);  
        // 创建一个换行<br>元素  
        var br = document.createElement('br');  
        // 将<br>元素添加到容器中，以实现换行效果  
        container.appendChild(br);  
    }  
</script>  
  
</body>  
</html>

使用JS实现数字递增以生成连续的URL链接

August 14, 2024 • Read: 59 • More

方法一

方法二

修改版