Question

我正在尝试使用JavaScript创建HTML。但是我对锚标记的链接没有按预期工作。

  var test ="http://blogs.edweek.org/edweek/finding_common_ground/2016/10/if_coaching_is_so_powerful_why_are't_principals_being_coached.html?cmp=SOC-EDIT-FB";

    var res ="<a style='color:#7Bc76B;text-decoration: none;' target='_blank' href='"+test+"'>Link to read more ></a>";

    document.getElementById("res").innerHTML = res;

https://jsfiddle.net/b4kqsn6u/

任何帮助将不胜感激。

由于

Answer 1

您可以按照以下方式修改<a>声明，以处理您网址中的单引号：

var res ='<a style="color:#7Bc76B;text-decoration: none;" target="_blank" href="'+test+'">Link to read more ></a>';

如上所述在单引号内声明，并且所有属性都在双引号内

https://jsfiddle.net/b4kqsn6u/3/

Answer 2

您的网址中有一个不属于该网址的单引号（'）。确保您事先通过将％单引号替换为％27来对您的网址进行urlencode编码或手动执行（encodeURI不对单引号进行编码）：

var test ="http://blogs.edweek.org/edweek/finding_common_ground/2016/10/if_coaching_is_so_powerful_why_aren't_principals_being_coached.html?cmp=SOC-EDIT-FB";

test = test.replace(/'/g, "%27");

var res ="<a style='color:#7Bc76B;text-decoration: none;' target='_blank' href='"+test+"'>Link to read more ></a>";

document.getElementById("res").innerHTML = res;

Answer 3

我通常把单引号放在双引号之外。单引号会使字符串不被解析

var test ="http://blogs.edweek.org/edweek/finding_common_ground/2016/10/if_coaching_is_so_powerful_why_are't_principals_being_coached.html?cmp=SOC-EDIT-FB";

var res ='<a style="color:#7Bc76B;text-decoration: none;" target="_blank" href="'+test+'">Link to read more ></a>';

document.getElementById("res").innerHTML = res;

<div id="res">

</div>

锚标记的Javascript动态创建无法正常工作

3 个答案: