JS中如何输出空格

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

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

   这是因为浏览器显示机制,对手动敲入的空格,将连续多个空格显示成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;”样式属性。这个样式表示"空白会被浏览器保留"

[HTML]在页面中输出空格的几种方式的更多相关文章

  1. Js 在页面中输入消息的几种方式

    一.方式 alert(“”); confirm(“”) ; prompt(“”);         接收用户信息 console.log(“”);      在网页控制台中输出消息 document. ...

  2. Asp.net MVC在Razor中输出Html的两种方式

    http://qubernet.blog.163.com/blog/static/177947284201485104616368/ Razor中所有的Html都会自动编码,这样就不需要我们手动去编码 ...

  3. 在Razor中输出Html的两种方式

    Razor中所有的Html都会自动编码,这样就不需要我们手动去编码了(安全),但在需要输出Html时就是已经转义过的Html文本了,如下所示: @{ string thisTest = "& ...

  4. java web中日期Date类型在页面中格式化显示的三种方式

    一般我们经常需要在将服务器端的Date类型,传到页面进行显示,这就涉及到一个如何格式化显示Date类型的问题,一般我们有三种方式进行: 1)在服务端使用SimpleDateFormat等类格式化成字符 ...

  5. 在JSP页面中输出JSON格式数据

    JSON-taglib是一套使在JSP页面中输出JSON格式数据的标签库. JSON-taglib主页: http://json-taglib.sourceforge.net/index.html J ...

  6. javascript小实例,在页面中输出当前客户端时间

    时间对象(Date())比较简单,本文旨在为初学者入门使用,大牛可略过! 本文承接基础知识实例,说一下实例的要求: 在页面中输出当前客户端时间(2015年1月1日星期一10:10:10这样的格式),每 ...

  7. 基础篇:1.JavaScript运行在html中,引用有几种方式?—— 6.js中常用的输出方式?

    书接上文,上文提到若干条JavaScript的基础性知识,大部分都是一些概念性的东西,本着认真严谨的态度,我们要认真对待,有些条目的问题是某个知识点的周边延伸,为节约篇幅,就一起整理了,如有描述不对的 ...

  8. ASP中页面之间传递值的几种方式

    ASP.NET页面之间传递值的几种方式 页面传值是学习asp.net初期都会面临的一个问题,总的来说有页面传值.存储对象传值.ajax.类.model.表单等.但是一般来说,常用的较简单有QueryS ...

  9. JS基础入门篇( 三 )—使用JS获取页面中某个元素的4种方法以及之间的差别( 一 )

    1.使用JS获取页面中某个元素的4种方法 1.通过id名获取元素 document.getElementById("id名"); 2.通过class名获取元素 document.g ...

随机推荐

  1. 20个实用javascript技巧及实践(二)

    21. 使用逻辑AND/OR来处理条件语句 var foo =10; foo ==10&& doSomething();// is the same thing as if (foo ...

  2. servlet中cookie和session操作

    1.1 软件中的会话 一次会话: 打开浏览器 -> 访问一些服务器内容 -> 关闭浏览器 登录场景: 打开浏览器 -> 浏览到登陆页面 -> 输入用户名和密码 -> 访问 ...

  3. mysql创建用户授权

    服务器上好多库,为了不让某用户误操作别人的数据库,给他单独建个用户并授权. insert into mysql.user(Host,User,Password, ssl_cipher, x509_is ...

  4. 利用Grahics 进行图片裁剪

    这两天做了一个图片对比工具,里面要处理两张大的图片,所以要对图片先进行裁剪最开始用了 /// <summary>        /// 裁剪图片        /// </summa ...

  5. /usr/lib64/python2.6/site-packages/cryptography/__init__.py:26: DeprecationWarning: Python 2.6 is no longer supported by the Python core team

    升级python2.6到2.7后,执行ansible后一直显示警告,如标题所示. 因为安装ansible,使用的是yum的方式,而yum使用的是python2.6,所以ansible安装环境为pyth ...

  6. Retrofit-入门使用

    1. 在模块目录下的build.gradle dependencies { compile "com.squareup.retrofit2:retrofit:2.1.0" comp ...

  7. Python学习---Python下[元组]的学习

    元组是不可变的, 用小括号()定义,而且一旦定义 ,不可变[类型是tuple] [元组看做一个整体,不可拆分,不可赋值,但可以全部重新赋值] 通过圆括号,用逗号分隔,常用在使语句或用户定义的函数能够安 ...

  8. Python学习---同步条件event/队列queue1223

    写在前面: 在使用这些共享API的时候,我们要注意以下几点: 在UNIX平台上,当某个进程终结之后,该进程需要被其父进程调用wait,否则进程成为僵尸进程(Zombie).所以,有必要对每个Proce ...

  9. for循环里面的break;和continue;语句

    for循环里面的break;和continue;语句 break语句 哇,我已经找到我要的答案了,我不需要进行更多的循环了! 比如,寻找第一个能被5整除的数: for循环中,如果遇见了break语句, ...

  10. ignore_user_abort函数制定计划任务

    PHP中的ignore_user_abort函数是当用户关掉终端后脚本不停止仍然在执行,可以用它来实现计划任务与持续进程,下面会通过实例讨论ignore_user_abort()函数的作用与用法.   ...