我在寫一個javascript程序，它可以在任何下面的表單中獲得輸入。動態創建錨點在第

"Here is the result \"<a href=\"www.google.com\">google</a>\", and \"<a href=\"www.yahoo.com\">yahoo</a>\""

或

"Here is a plain result"

，這是存儲在變量X的說，我想永遠當我遇到一個錨標記來創建一個錨標記。我知道a href將默認創建一個錨標記，但在我的情況下，結果呈現爲文本，這是我迄今爲止嘗試過的代碼。

var newLink = document.createElement('a'); 
newLink.href = 'http://google.com'; 
newLink.innerHTML = 'My anchor'; 

if (message) { 
    var x = message; 
    console.log(x.includes("href")); 
    if (!x.includes("href")) { 
     responsePara.appendChild(document.createTextNode(message)); 
     responsePara.appendChild(document.createElement('br')); 
    } else { 
     //responsePara.appendChild(document.createTextNode(message)); 
     responsePara.appendChild(newLink); 
     responsePara.appendChild(document.createElement('br')); 
    } 
}

，我很期待輸出爲情況1

<p> Here is the result "<a href="www.google.com">google</a>", and "<a href="www.yahoo.com">yahoo</a>"</p>

的情況下，2

<p>Here is a plain result</p>

請讓我知道我能做到這一點。

注意我只使用JS，無jQuery的

來源

2017-09-17 user3872094

我看不到你的問題，它應該是很容易實現這一點，對不對？

所有你需要解析的是輸入到HTML。另一個元素
（你的情況p元素）

UPDATE內

我已經更新了這個問題，所以你可以修改（或創建如果沒有ref）現有的元素與不分析a元素或純文本。

function createOrUpdateCompositeLink(input, ref) { 
 
    if (ref) { 
 
    var isLinkText = input.match(/href/g); 
 
    var elementChild; 
 

 
    if (isLinkText) { 
 
     elementChild = document.createElement('span'); 
 
     elementChild.innerHTML = input; 
 
    } else { 
 
     elementChild = document.createTextNode(input); 
 
    } 
 
    
 
    ref.appendChild(elementChild); 
 

 
    return ref; 
 
    } else { 
 
    var element = document.createElement('p'); 
 

 
    element.innerHTML = input; 
 
    return element; 
 
    } 
 
} 
 

 

 
/* USAGE */ 
 
var message; 
 
var element; 
 

 
message = "Here is the result "; 
 
message1 = "<a href=\"www.google.com\">google</a>\""; 
 
message2 = " something plain text "; 
 
message3 = ", and \"<a href=\"www.yahoo.com\">yahoo</a>\""; 
 

 

 
var reference = document.querySelector('.ref'); 
 
var el; 
 

 
createOrUpdateCompositeLink(message, reference); 
 
createOrUpdateCompositeLink(message1, reference); 
 
createOrUpdateCompositeLink(message2, reference); 
 
createOrUpdateCompositeLink(message3, reference);

<div class="ref"></div>

來源

2017-09-17 21:31:19 JoseAPL

我該如何添加一個錨標籤？，數據以純文本的形式呈現 – user3872094

您是否想要爲分析的元素添加額外的「未分析的」HTML？這是你的觀點嗎？ – JoseAPL

我建議你考慮使用jQuery和你正在嘗試做的就變成了：

jQuery(".response").append(message);

我假設你responsePara變量是從現有的<div>某處定義。在我的例子中，<div>將有一個名爲response的類。

<div class="response"></div>

一旦你得到一個消息，它被添加到響應div但一行jQuery()命令。

來源

2017-09-18 03:55:17

動態創建錨點在第

回答

UPDATE內

相關問題