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 相关文章推荐
javascript脚本编程解决考试分数统计问题
Oct 18 Javascript
jQuery 类twitter的文本字数限制带提示效果插件
Apr 16 Javascript
js判断上传文件类型判断FileUpload文件类型代码
May 20 Javascript
js处理php输出时间戳对不上号的解决方法
Jun 20 Javascript
JavaScript学习笔记之基础语法
Jan 22 Javascript
JavaScript基础知识点归纳(推荐)
Jul 09 Javascript
JavaScript仿微信打飞机游戏
Jul 05 Javascript
jQuery实现web页面樱花坠落的特效
Jun 01 jQuery
JavaScript闭包_动力节点Java学院整理
Jun 27 Javascript
用vue构建多页面应用的示例代码
Sep 20 Javascript
小程序实现带年月选取效果的日历
Jun 27 Javascript
vue-cli监听组件加载完成的方法
Sep 07 Javascript
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 生成的XML以FLASH获取为乱码终极解决
2009/08/07 PHP
phpmyadmin 3.4 空密码登录的实现方法
2010/05/29 PHP
从零开始学YII2框架(一)通过Composer安装Yii2框架
2014/08/20 PHP
php截取指定2个字符之间字符串的方法
2015/04/15 PHP
PHP实现通过get方式识别用户发送邮件的方法
2015/07/16 PHP
php性能分析之php-fpm慢执行日志slow log用法浅析
2016/10/17 PHP
JavaScript实现在页面间传值的方法
2015/04/07 Javascript
javascript常用功能汇总
2015/07/05 Javascript
jQuery实现form表单基于ajax无刷新提交方法详解
2015/12/08 Javascript
Nodejs express框架一个工程中同时使用ejs模版和jade模版
2015/12/28 NodeJs
JavaScript中三种常见的排序方法
2017/02/24 Javascript
Bootstrap滚动监听组件scrollspy.js使用方法详解
2017/07/20 Javascript
JS实现模糊查询带下拉匹配效果
2018/06/21 Javascript
NodeJS实现自定义流的方法
2018/08/01 NodeJs
10种JavaScript最常见的错误(小结)
2019/06/21 Javascript
Layui table field初始化加载时进行隐藏的方法
2019/09/19 Javascript
javascript头像上传代码实例
2019/09/28 Javascript
JS判断数组四种实现方法详解
2020/06/29 Javascript
[08:54]《一刀刀一天》之DOTA全时刻18:十九支奔赴西雅图队伍全部出炉
2014/06/04 DOTA
[09:31]2016国际邀请赛中国区预选赛Yao赛后采访 答题送礼
2016/06/27 DOTA
python进阶教程之动态类型详解
2014/08/30 Python
删除python pandas.DataFrame 的多重index实例
2018/06/08 Python
3行Python代码实现图像照片抠图和换底色的方法
2019/10/10 Python
python实现程序重启和系统重启方式
2020/04/16 Python
python中通过pip安装库文件时出现“EnvironmentError: [WinError 5] 拒绝访问”的问题及解决方案
2020/08/11 Python
CSS3实现银灰色动画效果的导航菜单代码
2015/09/01 HTML / CSS
购买原创艺术品:Zatista
2019/11/09 全球购物
澳大利亚床上用品、浴巾和家居用品购物网站:Bambury
2020/04/16 全球购物
3个CCIE对一个工程师的面试题
2012/05/06 面试题
大学生素质拓展活动方案
2014/02/11 职场文书
《草原的早晨》教学反思
2014/04/08 职场文书
产品售后服务承诺书
2014/05/21 职场文书
安全宣传标语口号
2014/06/06 职场文书
专题民主生活会对照检查材料思想汇报
2014/09/29 职场文书
电气工程师岗位职责
2015/02/12 职场文书
java设计模式--建造者模式详解
2021/07/21 Java/Android