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 相关文章推荐
让div层随鼠标移动的实现代码 ie ff
Dec 18 Javascript
BAT及各大互联网公司2014前端笔试面试题--JavaScript篇
Oct 29 Javascript
html的DOM中Event对象onblur事件用法实例
Jan 21 Javascript
详解JavaScript的变量和数据类型
Nov 27 Javascript
JavaScript自定义文本框光标
Mar 05 Javascript
Linux系统中利用node.js提取Word(doc/docx)及PDF文本的内容
Jun 17 Javascript
vue动态路由配置及路由传参的方式
May 23 Javascript
使用Angular-CLI构建NPM包的方法
Sep 07 Javascript
JS面向对象编程基础篇(三) 继承操作实例详解
Mar 03 Javascript
javascript设计模式 ? 迭代器模式原理与用法实例分析
Apr 17 Javascript
小程序中的箭头函数的具体使用
Jun 19 Javascript
vue-以文件流-blob-的形式-下载-导出文件操作
Aug 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编程最快明白(第一讲 软件环境和准备工作)
2010/10/25 PHP
解决ajax+php中文乱码的方法详解
2013/06/09 PHP
PHP入门教程之自定义函数用法详解(创建,调用,变量,参数,返回值等)
2016/09/11 PHP
php使用curl获取header检测开启GZip压缩的方法
2018/08/15 PHP
JavaScript While 循环基础教程
2007/04/05 Javascript
关于JavaScript与HTML的交互事件
2013/04/12 Javascript
JavaScript拆分字符串时产生空字符的解决方案
2014/09/26 Javascript
jQuery中parent()方法用法实例
2015/01/07 Javascript
jQuery+CSS3+Html5实现弹出层效果实例代码(附源码下载)
2016/05/16 Javascript
AngularJs 利用百度地图API 定位当前位置 获取地址信息
2017/01/18 Javascript
angular学习之从零搭建一个angular4.0项目
2017/07/10 Javascript
详解vue-cli构建项目反向代理配置
2017/09/07 Javascript
JavaScript 中使用 Generator的方法
2017/12/29 Javascript
详解React项目的服务端渲染改造(koa2+webpack3.11)
2018/03/19 Javascript
vue+elementUi图片上传组件使用详解
2019/08/20 Javascript
微信小程序实现同时上传多张图片
2020/02/03 Javascript
linux服务器快速卸载安装node环境(简单上手)
2021/02/22 Javascript
python实现从字典中删除元素的方法
2015/05/04 Python
给Python入门者的一些编程建议
2015/06/15 Python
Python读取一个目录下所有目录和文件的方法
2016/07/15 Python
Python WXPY实现微信监控报警功能的代码
2017/10/20 Python
python实现决策树分类(2)
2018/08/30 Python
在python中bool函数的取值方法
2018/11/01 Python
pandas.read_csv参数详解(小结)
2019/06/21 Python
pytorch 预训练层的使用方法
2019/08/20 Python
对python while循环和双重循环的实例详解
2019/08/23 Python
numpy创建单位矩阵和对角矩阵的实例
2019/11/29 Python
2021年的Python 时间轴和即将推出的功能详解
2020/07/27 Python
删除pycharm鼠标右键快捷键打开项目的操作
2021/01/16 Python
俄罗斯家居用品购物网站:Евродом
2020/11/21 全球购物
学生就业推荐信
2013/11/13 职场文书
童装店创业计划书
2014/01/09 职场文书
人资专员岗位职责
2014/04/04 职场文书
工资证明范本
2015/06/12 职场文书
学术会议领导致辞
2015/07/29 职场文书
PyTorch dropout设置训练和测试模式的实现
2021/05/27 Python