如何使用Javascript删除方案后的超链接样式？

所以我想显示一个被Javascript抓到的url。它返回到JS的形式http://i.mygreatsite.com，但我想削减方案关，使之清洁，并有实际的代码看起来像如何使用Javascript删除方案后的超链接样式？

<a href=http://i.mygreatsite.com>i.mygreatsite.com</a>

我试着这样做之前，我不得不设置一些网址上的特殊属性，即将目标设置为空白，以便在新选项卡中打开，并将超链接的颜色更改为黑色，因为页面上的其他链接为蓝色。我去一下这样的：

init: function() { 
       this.on("success", function(file, responseText) { 
        var span = document.createElement('span'); 
        var a = document.createElement('a'); 
        a.href = responseText; 
        a.innerHTML = responseText; 
        a.setAttribute('target', '_blank'); 
        a.style.color="black"; 
        span.appendChild(a); 
        span.setAttribute("style", "position: absolute; box-sizing: border-box; -webkit-box-sizing: border-box; bottom: -28px; left: 3px; right: 3px; height: 28px; word-wrap: break-word; line-height: 28px; text-overflow: ellipsis; "); 

        file.previewTemplate.appendChild(span); 

       }); 
      }

一切工作与它的罚款，但是当我去删除我用正则表达式做了它的模式：

repl = responseText.replace(/(https?:\/\/(\S+))/i, "<a href='$1'>$2</a>"); 
a.href = repl; 
a.innerHTML = repl; 
a.setAttribute('target', '_blank'); 
a.style.color="black";

现在的模式被删除，但没有我之前设置的属性之前在那里工作的属性现在在那里。该URL是蓝色的，并在同一个标签中打开。我在这里错过了什么吗？谢谢。

来源

2014-02-12 Lucifer N.

不知道为什么奇怪的行为，可能是因为您在标签设置既href和您的innerHTML。正则表达式很有趣，但在这种情况下，为什么不将href设置为原始响应文本，因为这是链接的URL，而innerhtml到responsetext.slice（8，responsetext.length）< - 这将切片的前8个字符字符串，因此删除https：// –

我也需要它删除http：//，而不仅仅是https：// –

啊k，但我认为问题在于您要在字符串中制作完整标记。我认为你需要将href设置为URL ='h ttp：//i.mygreatsite.com'，将innerHTML设置为替换文本'i.mygreatsite.com'。你现在的做法是将它们设置为：i.mygreatsite.com，这样你就可以得到一个非常奇怪的构造，可能是href标记中的一个href标记，浏览器将试图以可能意想不到的方式理解这一点 –

您已经结束得到的是另一个锚内的锚：

<a target="_blank" style="XXX"><a href="http://myurl">myurl</a></a>

这是因为设置你想创建锚的innerHTML的。在元素上设置样式不会级联（您应该真的使用CSS样式表），当然，target元素将不适用，因为它在技术上不会而是您点击的超链接！

相反，只需使用您的Regex的$2结果设置innerHTML即可。

编辑

所以你更新的代码将需要类似：

repl = responseText.replace(/(https?:\/\/(\S+))/i, "$2"); 
a.href = responseText; 
a.innerHTML = repl; 
a.setAttribute('target', '_blank'); 
a.style.color="black"; 
//Or if you wanted to use CSS stylesheets 
a.className = "myCssClass"

来源

2014-02-12 20:35:42

所以我尝试过： a.innerHTML = responseText.replace（/（https？：\/\ /（\ S +））/ i，“$2”）;结果仍然没有应用于其上的样式。如何在链接动态生成时使用样式表设置这些链接，并在页面加载后显示？ –

不确定您是否使用JQuery，但在本地JS中，您可以使用DOM对象的'className'属性设置'class'属性。请参阅W3Schools：[HTML DOM className属性]（http://www.w3schools.com/jsref/prop_html_classname.asp） –

更新了答案，快速了解我的意思。我希望澄清。 –

如何使用Javascript删除方案后的超链接样式？

回答

相关问题