JS输出空格的简单实现方法


Posted in Javascript onSeptember 08, 2016

在写JS代码的时候,大家可以会发现这样现象:

document.write("  1   2        3 ");
结果: 1 2 3

无论在输出的内容中什么位置有多少个空格,显示的结果好像只有一个空格。

这是因为浏览器显示机制,对手动敲入的空格,将连续多个空格显示成1个空格。

解决方法:

1. 使用输出html标签 来解决

document.write("  "+"1"+"    "+"23");

结果: 1  23

2. 使用CSS样式来解决

document.write("<span style='white-space:pre;'>"+" 1    2  3  "+"</span>");

结果: 1    2   3

在输出时添加“white-space:pre; ”样式属性。这个样式表示"空白会被浏览器保留"

以上这篇JS输出空格的简单实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
浏览器加载、渲染和解析过程黑箱简析
Nov 29 Javascript
jquery应该如何来设置改变按钮input的onclick事件
Dec 10 Javascript
JS文本框不能输入空格验证方法
Mar 19 Javascript
jQuery中读取json文件示例代码
May 10 Javascript
js基于面向对象实现网页TAB选项卡菜单效果代码
Sep 09 Javascript
js正则表达式验证邮件地址
Nov 12 Javascript
Bootstrap CSS组件之输入框组
Dec 17 Javascript
vue 封装自定义组件之tabal列表编辑单元格组件实例代码
Sep 07 Javascript
Web开发使用Angular实现用户密码强度判别的方法
Sep 27 Javascript
vue-cli webpack2项目打包优化分享
Feb 07 Javascript
JS匿名函数内部this指向问题详析
May 10 Javascript
详解jQuery如何实现模糊搜索
May 10 jQuery
jQuery文本框得到与失去焦点动态改变样式效果
Sep 08 #Javascript
jQuery动态改变多行文本框高度的方法
Sep 07 #Javascript
jQuery Ajax使用FormData对象上传文件的方法
Sep 07 #Javascript
jQuery Dialog 取消右上角删除按钮事件
Sep 07 #Javascript
jQuery实现的表格展开伸缩效果实例
Sep 07 #Javascript
JS实现页面载入时随机显示图片效果
Sep 07 #Javascript
JS简单实现浮动窗口效果示例
Sep 07 #Javascript
You might like
php-accelerator网站加速PHP缓冲的方法
2008/07/30 PHP
php 提速工具eAccelerator 配置参数详解
2010/05/16 PHP
php购物车实现代码
2011/10/10 PHP
解析htaccess伪静态的规则
2013/06/18 PHP
ueditor 1.2.6 使用方法说明
2013/07/24 PHP
php伪静态之APACHE篇
2014/06/02 PHP
php中Y2K38的漏洞解决方法实例分析
2014/09/22 PHP
php中的buffer缓冲区用法分析
2019/05/31 PHP
php简单计算权重的方法示例【适合抽奖类应用】
2019/06/10 PHP
javascript 动态添加表格行
2006/06/22 Javascript
一段效率很高的for循环语句使用方法
2007/08/13 Javascript
原生javascript实现图片滚动、延时加载功能
2015/01/12 Javascript
浅析创建javascript对象的方法
2016/05/13 Javascript
详解vue2.0组件通信各种情况总结与实例分析
2017/03/22 Javascript
React Native 集成jpush-react-native的示例代码
2017/08/16 Javascript
详解React+Koa实现服务端渲染(SSR)
2018/05/23 Javascript
解决vue-cli项目开发运行时内存暴涨卡死电脑问题
2019/10/29 Javascript
vuex 实现getter值赋值给vue组件里的data示例
2019/11/05 Javascript
JavaScript实现网页跨年倒计时
2020/12/02 Javascript
使用python实现递归版汉诺塔示例(汉诺塔递归算法)
2014/04/08 Python
Python中动态获取对象的属性和方法的教程
2015/04/09 Python
sublime text 3配置使用python操作方法
2017/06/11 Python
PyQt5 加载图片和文本文件的实例
2019/06/14 Python
Python如何基于rsa模块实现非对称加密与解密
2020/01/03 Python
PyQt5 文本输入框自动补全QLineEdit的实现示例
2020/05/13 Python
django 模型字段设置默认值代码
2020/07/15 Python
Python猫眼电影最近上映的电影票房信息
2020/09/18 Python
电子商务毕业生求职信
2013/11/10 职场文书
公司庆典邀请函范文
2014/01/13 职场文书
厨师个人自我鉴定范文
2014/04/19 职场文书
校园文明标语
2014/06/13 职场文书
写给医院的感谢信
2015/01/22 职场文书
感恩教育主题班会
2015/08/12 职场文书
Python实现天气查询软件
2021/06/07 Python
Oracle中update和select 关联操作
2022/01/18 Oracle
Python使用pyecharts控件绘制图表
2022/06/05 Python