主页 / 问题 / 628109
Accepted
Denis Bubnov
Asked:2020-02-15 19:22:20 +0000 UTC2020-02-15 19:22:20 +0000 UTC

保留来自另一个站点的导入内容的链接

  • 772

需要从另一个站点导入内容。在另一个站点的服务器上，我允许我的站点通过 接收内容，Access-Control-Allow-Headers这样就可以从那里接收内容。我在我的页面上做了以下事情：

<header class="header">
    <link rel="import" href="http://стороннийсайт/" />    
</header>

脚本本身，它添加了从第三方站点接收到的内容：

<script type="text/javascript">
    $(document).ready(function() {
        var link = document.querySelector('link[rel="import"]');
        var content = link.import;
        if (content != null) {
            var el = content.querySelector('.header');
            document.getElementsByTagName('header')[0].appendChild(el.cloneNode(true));
        }
    });
</script>

是的，我从另一个站点获取标题，其中包含一个带有多个链接的菜单。我不喜欢结果的地方：

  1. 接收到的内容中的图像未被提取
  2. 可嵌入的内容链接更改

据此，我有两个问题：

  1. 如何将图片从其他网站上传到您的网站？
  2. 如何建立正确的链接？

第二个问题的解释：

如果您转到第三方站点的页面，则它具有以下格式的链接：

http://third-party site/other/first
http://third-party site/other/two
http://third-party site/about

在我从第三方网站获取内容并将其嵌入到我自己的网站后，链接发生了变化：

http://mysite/other/first
http://mysite/other/two
http://mysite/about

我希望链接不变，但与第三方站点上的链接保持一致。

javascript

1 个回答

  1. Best Answer

    获取站点内容的脚本必须补充如下代码：

    var link = document.querySelector('link[rel="import"]');

// Clone the <template> in the import.
var template = link.import.getElementById('someData');
var clone = document.importNode(template, true);

var linksList = clone.querySelectorAll('img'); // или `a`
linksList.forEach((lnk) => {
  lnk.setAttribute(
    'src', // или href, для`a`
    'https: //ссылка которую надо вставить' + lnk.getAttribute('src') // или href, для`a`
  );
});
document.querySelector('#root').appendChild(clone);

    我们从中加载内容的站点的文件/地址的代码示例：

    <div id="someData">
    <h1>Hello World!</h1>
    <!-- Img is not requested until the <template> goes live. -->
    <img src="/assets/logo.png">
</div>

...
    • 1

相关问题