起因
由于公司的项目以前不考虑浏览器的兼容性问题,当时只考虑ie8浏览器,封装的控件也只针对ie8,我后面的做的时候,也就针对ie8,最近发现,封装的日期控件,在firefox竟然没法显示出来,去看JavaScript代码,才发现原来是用innerText获取的td的内容,这样在文本框获取日期的时候,一个也不会显示出来
innerText和innertHTML区别
1.innerText是IE4.0出的,不是所有浏览器都可以用的如firefox;而innerHTML是所有浏览器都可以用
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15 |
<!--通过选中checkbox获取对应label标签的内容--><table class="doc-table"> <tr> <td><strong>爱好:</strong></td> <td> <input type="checkbox"
name="ckb-love"
id="ckbSing"
/> <label id="lblSing"
for="ckbSing"><音乐></label> </td> </tr> <tr> <td colspan="2"> <input type="button"
id="btnSubmit"
value="提交"
/> </td> </tr></table> |
|
1
2
3
4
5
6
7
8
9
10
11 |
window.onload = function
() { var
btnSubmit = document.getElementById("btnSubmit"); btnSubmit.onclick = function
() { var
ckbEmelents = document.getElementsByName("ckb-love");//获取一组name为ckb-love的多选框 for
(var
i = 0; i < ckbEmelents.length; i++) { var
id = ckbEmelents[i].id; //拿到当前元素的id var
lblEmelent = document.getElementById(id.replace("ckb", "lbl"));//将id进行替换,获取label的内容 alert(lblEmelent.innerText); //在ie、chrome、opera都能显示<音乐> 在firefox中则显示 undefined } }} |
2.innerText会html特殊符号进行编码处理,不用特殊符号,而innerHTML则不会
|
1
2
3 |
<div id="test"> <span style="color: red">Hello</span> World!</div> |
|
1
2
3
4
5 |
//innerTextwindow.onload = function
() { var
text = document.getElementById("test").innerText; alert(text); //ie、chrome、opera 显示 Hello World! firefox依然显示 undefined} |
|
1
2
3
4
5
6 |
//innerHTMLwindow.onload = function
() { var
html = document.getElementById("test").innerHTML; alert(html); //ie、chrome、opera、firefox //显示 <span style="color: red">Hello</span> World!} |
innerText和innerHTML,布布扣,bubuko.com
原文地址:http://www.cnblogs.com/qq0827/p/3763850.html