javascript: leggi la semplice stringa html e utilizza il percorso dei collegamenti di modifica DOMparser

Question

Nella mia app angolare utilizzando uno dei WYSIWYG posso inserire collegamenti senza protocollo. E questo è un male:

ho bisogno di analizzare la stringa e cambiare tutto il legame di

e cerco di farlo (se thay non ha avuto protocollo http://...):

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 

http://jsfiddle.net/r3dgeo23/

Ma per alcuni motivi non funziona correttamente. Cosa faccio di sbagliato?

Answer 1

Se ho completamente capito la tua domanda, questo dovrebbe funzionare ...

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; 
    } 

Answer 2

si aveva quasi tutto diritto a meno che:

link[i].href 

restituisce undefined se nessun insieme di protocollo. Quindi hai dato la funzione addProtocolToLinks (indefinito) e non ha funzionato.

È possibile utilizzare:

getAttribute('href'); 

per farlo funzionare, si veda questo violino: http://jsfiddle.net/r3dgeo23/3/

///// EDIT

Ecco un violino solo per andare a prendere il parte del contenuto e non l'intero codice html: http://jsfiddle.net/r3dgeo23/5/

///// EDIT2

Creare il contenitore con id univoco all'interno vostra funzione:

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

http://jsfiddle.net/r3dgeo23/6/

Answer 3

Prova questo .. Si LAVORO

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; 
} 

la demo di esempio è qui http://jsfiddle.net/d9p9534h/

farmi sapere se ha funzionato

Answer 4

ne dici di questo?

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

NOTA: Non tutte le URI ha una parte un'autorità. Ecco perché l'espressione regolare non include //. Vedi this article

Answer 5

function Protocol(url) 
    { 

     if (url !== "") 
     { 


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