使用javascript构建html代码时转义特殊字符
Escape special characters when building html code using javascript
Hi我想使用javascript动态构建html代码。问题是,当我尝试使用为表指定css类时,它会给我带来语法错误。我想我需要去掉这里的特殊字符=和"。我试过这样的方法,但也出现了非法语法错误。
for (var i=0; i<array.length; i++)
{
htmlstr = htmlstr+"<table class"+%3D+%22+"test"+%22+"><tr><th>A</th><td>"+array[i].a+"</td></tr><tr><th>B</th><td>"+array[i].b+"</td></tr><tr><th>C</th><td>"+array[i].c+"</td></tr></table>";
}
有人知道这样做的正确语法是什么吗?
提前感谢!
htmlstr=htmlstr+'<table class="test"><tr><th>A</th><td>'
+array[i].a+'</td></tr><tr><th>B</th><td>'
+array[i].b+'</td></tr><tr><th>C</th><td>'
+array[i].c+'</td></tr></table>';
例如,如果你想将<input type="button" onClick="alert('Hello, World!');"></input>
封装在JavaScript字符串中,你不能在一次运行中完成,因为代码中同时包含双引号和单引号
var htmlCode='<input type="button" onClick="alert('+"'Hello, World!'"+');"></input>';
您可以使用单引号或双引号在javascript:中定义字符串变量
var str0='Hello, World!';
var str1="Hello, World!";
他们是绝对平等的。
下面是一个使用我在评论中提到的方法动态构建的示例。
CSS
.tableCSS, th, td {
border: 1px solid;
}
.tableCSS thead {
font-weight: bold;
}
Javascript
var array = [],
codePointAt,
length,
i;
array.push({
a: "A",
b: "B",
c: "C"
});
array.push({
a: "a1",
b: "b1",
c: "c1"
});
array.push({
a: "a2",
b: "b2",
c: "c3"
});
array.push({
a: "a3",
b: "b3",
c: "c3"
});
function convertSpaces(text) {
return text.replace(/ /g, "'u00a0");
}
for (i = 1, length = array.length; i < length; i += 1) {
var object = array[0],
table = document.createElement("table"),
thead = document.createElement("thead"),
tbody = document.createElement("tbody"),
tr,
td,
pre,
j;
table.className = "tableCSS";
table.appendChild(thead);
table.appendChild(tbody);
tr = thead.insertRow();
for (j in object) {
if (object.hasOwnProperty(j)) {
td = document.createElement("th");
td.appendChild(document.createTextNode(convertSpaces(object[j])));
tr.appendChild(td);
}
}
tr = tbody.insertRow();
object = array[i];
for (j in object) {
if (object.hasOwnProperty(j)) {
td = tr.insertCell(),
td.appendChild(document.createTextNode(convertSpaces(object[j])));
}
}
pre = document.createElement("pre");
pre.appendChild(table);
console.log(pre.innerHTML);
document.body.appendChild(table);
}
在jsfidd上
和innerHTML
的输出
<table class="tableCSS"><thead><tr><th>A</th><th>B</th><th>C</th></tr></thead><tbody><tr><td>c1</td><td>b1</td><td>a1</td></tr></tbody></table>
<table class="tableCSS"><thead><tr><th>A</th><th>B</th><th>C</th></tr></thead><tbody><tr><td>c3</td><td>b2</td><td>a2</td></tr></tbody></table>
<table class="tableCSS"><thead><tr><th>A</th><th>B</th><th>C</th></tr></thead><tbody><tr><td>c3</td><td>b3</td><td>a3</td></tr></tbody></table>
相关文章:
- 还原转义特殊字符
- Javascript中的正则表达式问题转义特殊字符
- 正在转义Javascript中的特殊字符,以便在MySql中使用它们
- 如何转义ajaxed数据中的特殊字符
- 转义javascript中的特殊字符以在javascript中使用它们
- Regex允许某些特殊字符-转义问题
- jquery在循环select中的项时转义特殊字符
- javascript(jquery)函数中的转义特殊字符
- 正则表达式转义空格和特殊字符
- EXTJS,如何转义特殊字符
- js:转义特殊字符
- 如何在按键时转义特殊字符和非英语字符
- 使用javascript构建html代码时转义特殊字符
- JQuery&Java servlet:转义特殊字符
- 如何在javascript拆分方法中转义特殊字符
- 如何在Javascript中转义特殊字符(<,>,",',&)将转义数据从一个文本框传递到另一个文本框
- 如何使用jQuery post()从文本区域转义特殊字符
- jQuery转义特殊字符失败
- 使用jQuery的css选择器,转义特殊字符
- 如何在jquery中转义特殊字符