这是我的HTML:
<ul id="myUL">
</ul>
这就是我正在做的事情:
var myString = " <li><a href="www.google.comp">Google</a></li> <li>Something Else</li>"
var div = document.createElement('div');
div.innerHTML = myString;
$("#myUL").append(div.innerHTML);
这是我收到的:
<ul id="myUL" >
<li><a href="www.google.com">Google</a></li> <li>Something Else</li>
</ul>
这是我想要接受的:
<ul id="myUL">
<li>
<a href="www.google.com">Google</a>
</li>
<li>
Something Else
</li>
</ul>
有任何建议吗?
答案 0 :(得分:8)
首先请注意,您无法将div
附加到ul
,因为它的HTML无效。 ul
只能包含li
个孩子。
问题本身是因为您的字符串包含转义的HTML。您可以使用普通字符串:
var myString = '<li><a href="http://www.google.comp">Google</a></li><li>Something Else</li>';
$("#myUL").append(myString);
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="myUL"></ul>
&#13;
或者你可以忘记字符串:
var myString = "<li><a href="www.google.comp">Google</a></li> <li>Something Else</li>"
$("#myUL").append(htmlDecode(myString));
function htmlDecode(input){
var e = document.createElement('div');
e.innerHTML = input;
return e.childNodes.length === 0 ? "" : e.childNodes[0].nodeValue;
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="myUL"></ul>
&#13;
有关htmlDecode()
功能的详情,请参阅this question。
答案 1 :(得分:3)
您还可以通过DOM Parser解析转义字符串:
function unescapeHTML(input)
{
var doc = new DOMParser().parseFromString(input, "text/html");
return doc.documentElement.textContent;
}
与您的代码一起......
var myString = " <li><a href="www.google.comp">Google</a></li> <li>Something Else</li>"
var div = document.createElement('div');
div.innerHTML = unescapeHTML(myString);
$("#myUL").append(div.innerHTML);
哪个应该有用。
答案 2 :(得分:3)
您也可以让jQuery为您解码。使用.html()
添加编码字符串将强制jQuery对其进行解码。然后,您可以使用.text()
获取解码结果。
var myString = "<li><a href="www.google.comp">Google</a></li> <li>Something Else</li>"
$("#myUL").html($("<div/>").html(myString).text());
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="myUL"></ul>
答案 3 :(得分:0)
您可以创建一个解码数据的简单函数 - 然后将该值分配给ul列表
100% — FF
95% — F2
90% — E6
85% — D9
80% — CC
75% — BF
70% — B3
65% — A6
60% — 99
55% — 8C
50% — 80
45% — 73
40% — 66
35% — 59
30% — 4D
25% — 40
20% — 33
15% — 26
10% — 1A
5% — 0D
0% — 00
#ff0074 for Pink
#33ff0074 for Light pink
答案 4 :(得分:0)
调用unescape函数来转换你的字符串
role_group_id type_id map_id path
1 1 1 A1
1 1 2 A2
1 1 3 A1.A3
1 1 4 A1.A3.A4
1 1 8 A1.A3.A4.A5
1 2 5 B1
1 2 6 B1.B2
1 2 7 B1.B2.B3
1 2 9 B4
2 1 3 A1.A3
2 2 6 B1.B2
2 2 7 B1.B2.B3
3 1 8 A1.A3.A4.A5
3 2 9 B4
var myString = "<li><a href="www.google.comp">Google</a></li> <li>Something Else</li>"
var div = document.createElement('div');
div.innerHTML = unescape(myString);
$("#myUL").append(div.innerHTML);
答案 5 :(得分:-1)
首先解码字符串:
var myString = " <li><a href="www.google.comp">Google</a></li> <li>Something Else</li>"
var div = document.createElement('div');
div.innerHTML = decodeURIComponent(myString);
$("#myUL").append(div.innerHTML);
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="myUL">
</ul>
&#13;