JS中如何输出空格

在写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中如何输出空格的更多相关文章

  1. JS 中如何输出空格

    在写JS代码的时候,大家可以会发现这样现象: document.write(" 1 2 3 "); 结果: 无论在输出的内容中什么位置有多少个空格,显示的结果好像只有一个空格. 这 ...

  2. JavaScript 基础——使用js的三种方式,js中的变量,js中的输出语句,js中的运算符;js中的分支结构

    JavaScript 1.是什么:基于浏览器 基于(面向)对象 事件驱动 脚本语言 2.作用:表单验证,减轻服务器压力 添加野面动画效果 动态更改页面内容 Ajax网络请求 () 3.组成部分:ECM ...

  3. 解决JavaScript中如何输出空格

    在写JS代码的时候,大家可以会发现这样现象:document.write("   1      2                3  ");结果: 1 2 3无论在输出的内容中什 ...

  4. Js 中的输出

    document.write()和window.alert() 1.window.document.write(字符串或者是变量名) 作用:它会在body标签内输出内容 说明: window代表当前浏 ...

  5. JS中,输出1-10之间的随机整数

    <script> document.write(parseInt(10*Math.random())); //输出0-10之间的随机整数 document.write(Math.floor ...

  6. [HTML]在页面中输出空格的几种方式

    JS中如何输出空格 在写JS代码的时候,大家可以会发现这样现象: document.write("   1      2                3  "); 结果: 1 2 ...

  7. Javascript开发技巧(JS中的变量、运算符、分支结构、循环结构)

    一.Js简介和入门 继续跟进JS开发的相关教程. <!-- [使用JS的三种方式] 1.HTML标签中内嵌JS(不提倡使用): 示例:<button onclick="javas ...

  8. 在winform中调用js文件并输出结果

    在winform中调用js文件并输出结果默认分类 2007-10-19 16:35:06 阅读25 评论0 字号:大中小 由于项目需要在winform中调一个强大的js,所以把这个tip记录在此: 1 ...

  9. js中关于一个数组中最大、最小值以及它们的下标的输出的一种解决办法

    今天在学习js中的数组时,遇到的输出一个数组中最大.最小值以及它们的下表,以下是自己的解决方法! <script type="text/javascript"> var ...

随机推荐

  1. 【转】linux sort 命令详解

    sort是在Linux里非常常用的一个命令,管排序的,集中精力,五分钟搞定sort,现在开始! 1 sort的工作原理 sort将文件的每一行作为一个单位,相互比较,比较原则是从首字符向后,依次按AS ...

  2. C#重启IIS指定网站和指定应用程序池

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...

  3. python关于分割与拼接的那些事

    1.split分割 基于re模块和正则表达式对象的方法split(),以后再做学习 基于字符串的split()方法 :字符串对象的split()方法也只能处理非常简单的情况,而且不支持多个分隔符,对分 ...

  4. 【React】启动dva脚手架

    开始前: 确保node版本为6.5以上. // 安装脚手架 npm i dva-cli -g // 自动安装新工程 dva new newProjectName // 导入antd包 npm i an ...

  5. The specified type member 'Date' is not supported in LINQ to Entities. Only initializers, entity members, and entity navigation properties

    出现这个错误提示可以用 DbFunctions.TruncateTime 将Linq中entity的DateTime转化一下再使用,如下所示: var anyCalls = _db.CallLogs. ...

  6. Protocol Buffer搭建及示例

    本文来源:http://www.tanhao.me/code/150911.html/ Protocol Buffer(简称Protobuf或PB)是由Google推出的一种数据交换格式,与传统的XM ...

  7. ASP.NET中使用UpdatePanel实现局部异步刷新方法和攻略(转)

    asp.net UpdatePanel实现异步局部刷新 如有雷同,不胜荣欣,若转载,请注明 鉴于最近项目需要,研究了一下UpdatePanel控件的使用方法,现总结如下,可能有很多地方不足,还望大家斧 ...

  8. div高度根据内容自动增大

    1.很多时候我们希望容器高度能够自适应内部元素的变化,需要用到min-height属性. 2.有时候用了min-height还是不会随着内容自适应高度,您需要检查下容器的子元素是不是有浮动属性,当子元 ...

  9. warning C4996: 'sprintf': This function or variable may be unsafe

    选项Project   |   Configuration   Properties   |   C/C++   |   Preprocessor   |   Preprocessor   Defin ...

  10. appium的几点总结

    原文链接:http://blog.csdn.net/bear_w/article/details/50345283 1. 建立session时常用命令: DesiredCapabilities cap ...