能否用JavaScript将目标URL内容存入变量并提取锚点标签？

当然可以实现！我明白你要的是不用跳转到目标页面，直接在当前页面脚本里远程抓取目标URL的内容，提取锚点列表——和你在VB里的实现逻辑是一样的，JavaScript里完全能做到，核心是用HTTP请求获取目标页面的HTML文本，再把文本解析成DOM对象来提取元素。下面给你具体的方案：

核心实现思路 #

1. 用fetch API（现代浏览器支持）发送HTTP请求，获取目标URL的HTML源代码
2. 用DOMParser把HTML文本转换成可操作的DOM文档对象
3. 在这个虚拟DOM里查询所有<a>标签，提取你需要的信息（比如href、文本内容）
4. 处理可能的跨域限制（这是浏览器端的关键坑点）

具体代码实现 #

前端脚本函数 #

async function getAnchorsFromUrl(targetUrl) {
  try {
    // 1. 发送请求获取目标页面的HTML内容
    const response = await fetch(targetUrl);
    if (!response.ok) {
      throw new Error(`请求失败，HTTP状态码: ${response.status}`);
    }
    const htmlText = await response.text();

    // 2. 将HTML文本解析为DOM文档（相当于在内存里创建一个虚拟页面）
    const parser = new DOMParser();
    const virtualDoc = parser.parseFromString(htmlText, 'text/html');

    // 3. 提取所有锚点标签，整理成结构化数据返回
    const anchorElements = Array.from(virtualDoc.querySelectorAll('a'));
    return anchorElements.map(anchor => ({
      href: anchor.href, // 完整的URL（自动补全相对路径）
      text: anchor.textContent.trim(), // 锚点显示的文本
      innerHTML: anchor.innerHTML // 如果需要保留HTML结构的话
    }));
  } catch (error) {
    console.error('提取锚点时出错:', error);
    return []; // 出错时返回空数组，避免后续代码报错
  }
}

// 调用示例
getAnchorsFromUrl('https://example.com')
  .then(anchors => {
    console.log('提取到的锚点列表:', anchors);
    // 这里可以把锚点列表渲染到页面上，或者做其他处理
  });

关键注意点：跨域问题 #

上面的代码在目标URL和当前页面同源（比如都是http://localhost:8080）的时候能直接运行，但如果目标URL是外部网站（比如https://example.com），浏览器会因为同源策略阻止请求，控制台会报类似No 'Access-Control-Allow-Origin' header is present on the requested resource的错误。

这时候的解决办法是：

• 如果你能控制目标网站的服务器，可以在目标网站设置CORS响应头，允许你的域名访问
• 如果你控制不了目标网站，就需要自己搭一个后端代理：让后端服务器去请求目标URL，再把结果返回给前端脚本

简单的Node.js代理示例 #

// 先安装依赖：npm install express node-fetch
const express = require('express');
const fetch = require('node-fetch');
const app = express();

// 代理接口
app.get('/proxy', async (req, res) => {
  const targetUrl = req.query.url;
  if (!targetUrl) {
    return res.status(400).send('请传入目标URL参数（?url=xxx）');
  }
  try {
    const response = await fetch(targetUrl);
    const htmlText = await response.text();
    res.send(htmlText);
  } catch (error) {
    console.error('代理请求出错:', error);
    res.status(500).send('代理请求失败');
  }
});

// 启动代理服务器
const PORT = 3000;
app.listen(PORT, () => {
  console.log(`代理服务器运行在 http://localhost:${PORT}`);
});

然后前端调用的时候，把目标URL传给代理接口：

getAnchorsFromUrl('http://localhost:3000/proxy?url=https://example.com')
  .then(anchors => console.log(anchors));

这样就能绕过浏览器的跨域限制，在原页面脚本里完成远程页面的锚点提取，完全不用跳转到目标页面。

内容的提问来源于stack exchange，提问作者Keyzz Locks