javascript: đọc chuỗi html đơn giản và sử dụng đường dẫn thay đổi DOMparser đường dẫn

Question

Trong ứng dụng góc của tôi sử dụng một trong WYSIWYG tôi có thể chèn liên kết mà không có giao thức. Và điều này là xấu:

tôi cần phải phân tích chuỗi và thay đổi tất cả liên kết của

và tôi cố gắng để làm như vậy (nếu Thầy không có giao thức để 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/

Nhưng vì một số lý do, nó không hoạt động bình thường. Tôi đã làm gì sai?

Answer 1

Nếu tôi hoàn toàn hiểu câu hỏi của bạn, điều này sẽ làm việc ...

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

bạn có hầu hết mọi thứ đúng ngoại trừ:

link[i].href 

lợi nhuận undefined nếu không có thiết lập giao thức. Do đó bạn đã cho bạn hàm addProtocolToLinks (không xác định) và nó không hoạt động.

Bạn có thể sử dụng:

getAttribute('href'); 

để làm cho nó làm việc, thấy fiddle này: http://jsfiddle.net/r3dgeo23/3/

///// EDIT

Đây là một fiddle chỉ lấy các phần nội dung chứ không phải toàn bộ html: http://jsfiddle.net/r3dgeo23/5/

///// EDIT2

Tạo container với id duy nhất trong chức năng của bạn:

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

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

Answer 3

Hãy thử điều này .. Nó được LÀM VIỆC

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

mẫu thử nghiệm ở đây http://jsfiddle.net/d9p9534h/

Hãy cho tôi biết nếu nó hoạt động

Answer 4

Làm thế nào về điều này?

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

LƯU Ý: Không phải mọi URI đều có phần ủy quyền. Đó là lý do tại sao cụm từ thông dụng không bao gồm //. Xem this article

Answer 5

function Protocol(url) 
    { 

     if (url !== "") 
     { 


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