JavaScript-将URL解析为主机名

我正在寻找一种将给定url解析为主机名、端口和子域名的方法。我从这里得到了这样的代码：

但是这里“parser.href”是一个url。相反，我有一个名为“q”的用户输入的JavaScirpt变量。我需要将变量'q'的值发送到parser.href。我试图简单地以parser.href=q的形式编写，但没有成功

然后我尝试将上面的实现作为一个函数模型，通过该模型我将变量q传递给它，但这也不起作用。以下是函数：

  function parseUrl(url) {
        var parser = document.createElement('a');
        parser.href = url;
      return(parser.hostname);
}

var host = parseUrl(q);

我认为在执行函数后，变量“host”将具有从函数返回的主机名，但这也不起作用。有人能告诉我如何修改它以使其正确工作吗

非常感谢

这对我来说确实有用

它已经起作用了

结帐

---

你的fiddle总是返回答案“fiddle.jshell.net”，不管你给出了什么样的inout，对吗？这正是我面临的问题。我得到的是我实现此功能的站点的主机名，而不是保存在javascript variableNo中的url的主机名，它总是给出正确的主机名，如果我复制此问题的url，并将其粘贴到输入中，它说stackoverflow.com

  function parseUrl(url) {
        var parser = document.createElement('a');
        parser.href = url;
      return(parser.hostname);
}

var host = parseUrl(q);

   function parseUrl(url) {
        var parser = document.createElement('a');
        parser.href = url;
      return(parser.hostname);
   }

var output = document.getElementById('output');
var input = document.getElementById('input');

input.onkeyup = function(e) {
    output.innerHTML = parseUrl(input.value);
};

function parseUrl(url) {
    var parser = document.createElement('a');
    parser.href = url;
  return(parser.hostname);
}

var host = parseUrl('http://example.com:3000/pathname/?search=test#hash');
document.write(host);