这篇文章介绍一点关于在HTML中使用回车和空格的时候会产生的一个小问题，问题虽小但是可使本人头痛了一阵子，找了好久才找到原因

所以我的最终建议是不要在HTML中强行键入空格和回车这种会占位的空白字符

下面看看这段HTML代码大家就明白是怎么回事了（经IE8测试）：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
</head>
<body>

<div id="div1" ><input id="hidden" type="hidden" />               123</div><!--123前面的空格和回车会导致div1的innerText和div1的innerHTML中在123前面出现一个空格-->
<div id="div2" ><input id="hidden1" type="hidden" />123</div><!--若123和hidden1之间没有空格或回车，那么div2的innerText和div2的innerHTML中在123前面就不会出现空格-->
<div id="div3" >                                    123</div><!--虽然123前面有一大串空格，但是由于其前面无任何同级的HTML标签所以div3的innerText和div3的innerHTML中在123前面也不会产生空格-->
<div id="div4" ><span></span>                123</div><!--虽然123前面有一大串空格，而且前面也有同级的HTML标签span，但是经测试发现内部为空的span和a标签(可能还有其他标签，这里懒得去全部试了)，也不会让123前面出现空格，但是将本行的<span></span>改为<span>123</span>使标签中有文本子标签就另当别论了（事实上如果其内部包括会让空格出现的子标签比如input，也会使123前面出现空格），这样div4的innerText和div4的innerHTML中在123前面就会出现空格-->

<input  type="button" value="查看有内标签有空格" onclick="alert(document.getElementById('div1').innerText+'\n123');" />
    <input  type="button" value="查看有内标签无空格" onclick="alert(document.getElementById('div2').innerText+'\n123');" />
    <input  type="button" value="查看无内标签无空格" onclick="alert(document.getElementById('div3').innerText+'\n123');" />
    <input  type="button" value="也不是所有的内标签产生空格" onclick="alert(document.getElementById('div4').innerText+'\n123');" />
</body>
</html>

在HTML中小心使用空格和回车相关推荐

  1. SQL去除数据库表中tab、空格、回车符等特殊字符的解决方法

    SQL去除数据库表中tab.空格.回车符等特殊字符的解决方法 参考文章: (1)SQL去除数据库表中tab.空格.回车符等特殊字符的解决方法 (2)https://www.cnblogs.com/ml ...

  2. vue3+ts 项目空格和回车代码出现红色波浪线

    新创建了一个vue3+typescript项目,在项目中加一个空格或者回车换行就出现红色波浪线: 我的解决办法是在vsCode的扩展中找到 ESLint 点击禁用 然后再点击重新加载就可以解决了

  3. textarea 中获取用户的空格和回车

    今天在工作中要通过textarea 获取用户的空格和回车 ,保存好用户的格式,在前台显示,总是遇到空格和换行的问题,就仔细研究了下,因为在ie和火狐中老是不兼容,在网上找了下也没找到好的解决办法,于是 ...

  4. 换行符javajava去除字符串中的空格、回车、换行符、制表符

    在改章节中,我们主要介绍换行符java的内容,自我感觉有个不错的建议和大家分享下 每日一道理 只有启程,才会到达理想和目的地,只有拼搏,才会获得辉煌的成功,只有播种,才会有收获.只有追求,才会品味堂堂 ...

  5. Qt中去掉空格和回车（两行代码）

    因为要对添加进来的流地址进行一个预处理,去掉里面的空格和回车,否则会对后面服务程序有影响. 去掉QString中的空格和回车很简单,下面两行代码即可. copytxt = copytxt.simpli ...

  6. JS 删除字符串中的空格和回车

    删除字符串中的空格 test_str = test_str.replace(/\ +/g, ""); 删除字符串中的回车 test_str= test_str.replace(/[ ...

  7. java 去掉字符串中的换行_java删除字符串中的空格、回车、换行符、制表符程序...

    本程序来详细的介绍关于java删除字符串中的空格.回车.换行符.制表符程序实例,有需要学习的朋友可参考参考. java换行符 那是因为默认的情况下,界面上的换行时用的"n",这是L ...

  8. UltraEdit中显示空格与回车的问题

    原网址:http://blog.sina.com.cn/s/blog_4983ea900100ikot.html ue中如何显示空格及行结尾呢? 视图-->显示空格/制表符and显示行结尾 空格 ...

  9. angularjs中按回车事件_在AutoCAD中巧用空格键或回车键，制图效率高

    AutoCAD在很多行业都有应用,学会AutoCAD多少有些用处.下面介绍以下关于应用空格键或回车键的几个常用技巧,懂得应用的话,制图效率会提升. (1)巧用空格键与回车键重复上一个命令 在完成一个制 ...

最新文章

  1. saltstack源码安装nrpe
  2. CowNew开源团队4月14日聚会
  3. python中的logging记录日志_[ Python入门教程 ] Python中日志记录模块logging使用实例...
  4. How where used list in SAP GUI is implemented
  5. mysql 强制读主库_laravel(lumen)配置读写分离后，强制读主（写）库数据库，解决主从延迟问题...
  6. SQL Search
  7. a b和c 15 java_1011. A+B和C (15)
  8. C++ 左值和右值 的学习
  9. 金额逾千万！浪潮智能存储G2中标华中科技大学脑科学研究项目
  10. LINUX 游戏服务器之旅4_mongodb环境
  11. Android View框架总结（九）KeyEvent事件分发机制
  12. RuntimeError: Legacy autograd function with non-static forward method is deprecated. Please use new-
  13. linux读写磁盘文件寿命,linux下TF卡测试寿命的测试程序编写
  14. PMP第六版5大过程组49个过程
  15. html按钮点击后无效,关于html中按钮的单击事件，第一次单击可以运行，再次单击不能运行的解决方法...
  16. win7快捷关闭计算机,win7系统快速启动功能关闭的处理方法
  17. 【江枫】AIX虚拟内存管理机制
  18. Camera硬件结构组成（三）
  19. 趣图：凌晨三点，灯火阑珊处
  20. Windows Server 2003服务器群集创建和配置指南

热门文章

  1. ES6中 const 关键字
  2. Python 文件写操作
  3. 使用CodeIgniter
  4. Vs 控件错位 右侧资源管理器文件夹点击也不管用，显示异常
  5. SQL Server 2008 BIDS组件的安装
  6. Spring学习（六）bean装配详解之 【通过注解装配 Bean】【基础配置方式】
  7. js中json的创建和解析
  8. 使用 bash 脚本把 AWS EC2 数据备份到 S3
  9. ROS学习之日志消息
  10. leecode-数组-27Remove Element-java