js中使用append应注意自动补全问题
日常中会用到元素的append方法去扩展子标签。
但今天的一个任务中遇到一个发现它的一个特点,一般的标签是如<td></td>、<tr></tr>、<div></div>以成对出现,如果缺少一个都会出错,而append为了保证页面代码的准确性,会对标签进行自动补全,如
document.getElementsById('top').append('<tr>');append的参数字符串中只包含一个<tr>而没有结束标签</tr>,在页面中会自动在<tr>后面补全</tr>。
这似乎是一个挺人性化的操作,但对于某些时候就是个灾难!
看如下代码:
top=document.getElementsById('top');
top.append('<tr>');
top.append('<td>内容'</td>);
top.append('</tr>');代码明显意图是扩展一个<tr><td>内容</td></tr>的内容,但实际结果却是这样:
<tr></tr><td>内容</td><tr></tr>完全不是想要的结果。。。。。。
所以在凡事都有两面性,而我恰好碰到了这个问题,仅此和大家分享
本文内容仅供个人学习、研究或参考使用,不构成任何形式的决策建议、专业指导或法律依据。未经授权,禁止任何单位或个人以商业售卖、虚假宣传、侵权传播等非学习研究目的使用本文内容。如需分享或转载,请保留原文来源信息,不得篡改、删减内容或侵犯相关权益。感谢您的理解与支持!