我在写一个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内

相关问题