javascript：读取纯html字符串并使用DOMparser更改链接路径

在我的angular应用程序中，使用WYSIWYG之一，我可以插入没有协议的链接。这很糟糕：

我需要解析字符串并更改所有链接（如果他们没有协议的话）

我试着这样做：

var content = '<p>7</p><p>77</p><p><br></p><p><a href="http://example.com" rel="nofollow">http://example.com</a></p><p><br></p><p><a href="example.com" target="_blank">example.com</a></p><p><br></p><p><a href="ftp://localhost">ftp://localhost</a></p><p><br></p><p><a href="localhost">localhost</a><br></p>';

var addProtocolToLinks = function(URL){
    var protocols = ['http', 'https', 'ftp', 'sftp', 'ssh', 'smtp'];
    var withProtocol = false;
    if (URL.length > 0){
      protocols.forEach(function(el) {
        if (URL.slice(0,4).indexOf(el) > -1){
          withProtocol = true;
        }
      });
      var newURL =  URL;
      if (!withProtocol){
        newURL = 'http://' + URL;
      }
      console.log(newURL + '   ' + URL);
      return newURL;
    }
};

var parser = new DOMParser();
var doc = parser.parseFromString(content, "text/html");
var links = doc.getElementsByTagName("a");
for(var i=0; i<links.length; i++) {
    links[i].setAttribute('href', addProtocolToLinks(links[i].href));
    console.log('result: ' + links[i].getAttribute('href'));
}

console.log('result html: ');
console.log(doc);  // also i need to fetch only my var content part, without html, body etc

var-content='7
77








<；
var addProtocolToLinks=函数（URL）{
var协议=['http'，'https'，'ftp'，'sftp'，'ssh'，'smtp']；
var withProtocol=false；
如果（URL.length>0）{
协议。forEach（函数（el）{
if（URL.slice（0,4）.indexOf（el）>-1）{
withProtocol=true；
}
});
var newURL=URL；
如果（！withProtocol）{
newURL='http://'+URL；
}
console.log（newURL+''+URL）；
返回newURL；
}
};
var parser=新的DOMParser（）；
var doc=parser.parseFromString（内容，“text/html”）；
var links=doc.getElementsByTagName（“a”）；
对于（var i=0；i如果我完全理解了你的问题，这应该是可行的

    function jsF_addHTTP( url )
    {

        if (url !== "") 
        {
            // Insert HTTP if it doesn't exist.

            if ( !url.match("^(http|https|ftp|sftp|ssh|smtp)://") ) 
            {
                url = "http://" + url;
            }
        }
        return url;
    }

你几乎什么都对，除了：

link[i].href

如果没有协议集，则返回未定义。因此，您给了函数addProtocolToLinks（未定义），但它不起作用

您可以使用：

getAttribute('href');

要使其工作，请参阅此小提琴：

///EDIT

下面是一个仅获取内容部分而非整个html的提琴：

///EDIT2

在函数中创建具有唯一id的容器：

var container = document.createElement('div');
container.setAttribute("id", "content");
container.innerHTML = content;

试试这个。。
它正在工作

var addProtocolToLinks = function(URL){
protocols = ['http', 'https', 'ftp', 'sftp', 'ssh', 'smtp'];
protocols.forEach(function(item) {
    if(url.indexOf(item) != -1) {
    newUrl = "http://"+url.substr(url.indexOf("//")+2);
   }    
});
return newUrl;
}

示例演示在这里

让我知道它是否有效
这个怎么样

function ensureProtocol(href) {
    var match = href.match(/^((\w+)\:)?(.*)/);
    var protocol = match[1] || 'https:';
    return protocol + match[3];
}

注意：并非每个URI都有权限部分。这就是正则表达式不包含
/
的原因。请参见）确保我的内容是动态的，并且我不仅可以将其更改为
）。。。抓取未完成）然后您可以在函数中创建容器-我编辑了我的答案。
function Protocol( url )
    {

        if (url !== "") 
        {


            if ( !url.match("^(http|https|ftp|sftp|ssh|smtp)://") ) 
            {
                url = "http://" + url;
            }
        }
        return url;
    }