Question

你好我有一个循环的函数，最后一个字符串被发送到DIV标签类......

   $(document).ready(function addcopy() {
         /* global */
         $(".Bands").append('<div style="display: inline-block;">[EDIT]&nbsp;<a href="[LINK]"><h7 style="color:#7A0029;line-height: 110%;text-transform: uppercase;">[Custom:Name]</h7></a>&nbsp;</div>');
     });

它工作正常......但令牌[自定义：名称]可能包含特殊字符，如单引号或双引号等...

我环顾这些论坛，并试图让我的代码适应所提供的各种解决方案，它似乎永远不会有效，有人可以帮助我吗？

感谢您的帮助！

亚历

EDIT（1）：

从Ockert和LeFex的答案到某个地方，我已经在下面对它进行了调整，但它仍然不起作用（用html无法处理的令牌替换语音标记和特殊字符）......

function htmlEncode(value){
return $('<div/>').text(value).html();
}

$(document).ready(function (){
    /* global */
    var band = $("<div style='display: inline-block;'>[EDIT]&nbsp;<a href='[LINK]'><h7 class='name' style='color:#7A0029;line-height: 110%;text-transform: uppercase;'>[Custom:Name]</h7></a>&nbsp;</div>");


    band.appendTo(htmlEncode('.Bands'))

});

Answer 1

您也可以更改脚本

$(document).ready(function (){    
    var band = $("<div style='display: inline-block;'>[EDIT]&nbsp;<a class='link' href='[LINK]'><h7 class='name' style='color:#7A0029;line-height: 110%;text-transform: uppercase;'>[Custom:Name]</h7></a>&nbsp;</div>");

    band.find('.name').html("some weird name !@#$%^&*");
    band.find('.link').attr("href","http://www.google.com");
    band.appendTo('.Bands');

});

通过将其拆分，您可以将名称设置为您想要的任何名称。您可以轻松选择名称元素

看看这个jsfiddle http://jsfiddle.net/fL3gn056/2/

Answer 2

您可以使用document.createElement而不只是附加字符串。

http://www.w3schools.com/jsref/met_document_createelement.asp

如果您只是创建div，a和h7元素，使用appendChild函数，并通过设置元素属性添加样式和属性以及内容，最终应该使用允许任何特殊字符的sollution。

编辑：

我无法使用该方法使其工作;但是，根据我上面建议的方法，我得到了一些工作代码：

var element = document.createElement("div");

element.style.display = "inline-block";

var link = document.createElement("a");
link.setAttribute('href', "[LINK]");

var text = document.createElement("h7");

text.style.color = "#7A0029";
text.style.lineHeight = "110%";
text.style.textTransform = "uppercase";
text.innerHTML = "[CUSTOM:NAME]";

//not sure what you're appending it all to, but do it here
document.getElementsByClassName("Bands")[0].appendChild(element);
element.appendChild(link);
link.appendChild(text);

使用此片段，所有输入特殊字符都被解释为字符串，而不是代码。我可以把一些电话放在同一行，但这样你就可以看到一个易于阅读的概述。

这里是关于这个主题的早期主题，最重要的答案带来了不同讨论方法的表现问题。

jQuery document.createElement equivalent?

htmlencode在javascript中的字符串

2 个答案: