Question

我有以下代码，可用于检索服务器的主机名并向其添加一些文本（文件名）并将其显示在html页面上。

<script type="text/javascript">
    function getBaseUrl() {
        var re = new RegExp(/^.*\//);
    }
</script>

<script type="text/javascript">
    document.write(getBaseUrl() + "filename.ext");
</script>

这将生成一个服务器URL，例如https://fqdn/folder/filename.ext，这正是我所需要的。我试图从中创建链接的所有事情都会破坏事情。如何使生成的文本可点击？

Answer 1

您需要将其包装在<a href=''></a>中。如果您将有问题的<a>元素分配给变量，这是最简单的，因为您随后可以使用 .href 和 {{3} } 修改文本：

function getBaseUrl() {
  return 'http://www.google.com/';
}

const output = document.getElementById('output');
output.innerHTML = 'Link Title';
output.href = getBaseUrl() + "filename.ext";

<a id="output" href=""></a>

如果您无权访问HTML，则仍然可以通过在输出中仅包含<a href=''></a>包装器来使用原始JavaScript，并小心输出单引号：

function getBaseUrl() {
  return 'http://www.google.com/';
}

document.write("<a href='" + getBaseUrl() + "filename.ext" + "'>Link Title</a>");

Answer 2

做起来很简单-

const link = getBaseUrl()+ "filename.ext";

createLinkNode(link, document.body);

// defining a function to create a link node, however this isn't neccessary,
// you could just hard code the logic above.
// I wouldn't recommend setting innerHtml in lieu of making a text node however.
function createLinkNode(url, parent) {
  const linkTextNode = document.createTextNode(url);
  const linkNode = document.createElement('a');
  linkNode.href = url;
  linkNode.appendChild(linkTextNode);

  parent.appendChild(linkNode);
}

示例：https://jsfiddle.net/f4wxvLky/3/

Answer 3

尝试一下，我认为getBaseUrl（）可以正常工作，尽管看起来不太像。提醒一下，<a>标记必须位于<script>块下

<script>
    function getBaseUrl() {
        var re = new RegExp(/^.*\//);
    }
</script>

<a href="javascript:" onclick="location.href=getBaseUrl() + 'filename.ext'">Click</a>

如何将JavaScript结果显示为HTML链接？

3 个答案: