前端小白历险记（二）原来是你腾讯搞的鬼！

书接前文（  https://bbs.huaweicloud.com/blogs/181124  ）

在 @胡琦 大大的帮助下，张小白终于学会了用VsCode的hexdump插件查看十六进制原文，从而分析出了： 链接失效是因为 abc 第一个a字母和href之间的空格，其实是由两个字节构成，0xC2 0xA0（以下简称C2 A0）。

根据张小白的杠精性尿性，光光知道“C2 A0 !=== 20，从而导致斜杠丢失”这个事实是不能满足张小白的。张小白想知道，自己何以沦落至此？所以C2 A0就变成了张小白心中的梦魇，直到他在度娘盘到了以下内容：

看来这不是一个特例，而是一个普遍的问题。无论是HTML，还是Java，Python，都会遇到类似的问题。甚至这个C2 A0几乎无法通过trim去掉空格，导致原本你想去掉空格的时候，假空格还坚挺地站立在那里。C2 A0叫做 NO-BREAK SPACE。中文翻译过来就是：不间断空格。它会表现为一个半角空格，这跟ASCII码为0x20的空格在展示上完全一样，这造成在VsCode编辑器上就有很大的迷惑性。网上因为这事儿中招的人还特别多。

那么，它到底是如何产生的？张小白一直在想如何重现这个问题。当然，所谓的重现并不是说，在上次错误HTML文档的基础上做Ctrl-C和Ctrl-V，而是看看到底啥情况会出现C2 A0。

直接在VsCode中反复转换好像不大容易试出来，张小白又展开了进一步的搜索，搜索工具除了度娘之外，使用了bing, 360和sogou。（鉴于最近有人因使用科学软件被抓，张小白也不敢学科学）。

要知道，张小白在上《WEB前端全栈成长计划》课程的时候，是随时用 微信做笔记的：要么截图，要么发一些文字留存。稍后再对这些内容做整理，就可以形成一篇图文并茂的文字（包括本文的诞生）。

所以，张小白就做了一个很简单的实验：在VScode上快速建立一个HTML文件（还记得！+TAB键吗？不会的，学一下！）

我们预览下：

然后将下面这段代码贴到微信中去：

百度

如图所示：

（是的，我可能是发给了我的小号，或者别人的大号，大家都不要猜了）。

然后，我把这段文字，再从微信CTRL-C,CTRL-V回VsCode的HTML文件中。

你看的没错，贴回来就是这个样子，后面好像多了个空格。删掉那个空格，让<>不再飘红：

好像没问题吧？

预览一下：

终于重现故障！大快小白心！

拿出Hexdump大旗。。。

从图中可见，第二个的空格已经变成了 C2 A0.

看来，果然是腾讯的微信在使用ctrl-C,ctrl-V往VsCode编辑器拷贝东西的时候，微信会在你拷贝的时候加点“料”。（是防拷贝政策吗？）

这个时候应该怎么办？

试试使用记事本big法：先将微信内容Ctrl-C后，粘贴到记事本上，然后再Ctrl-C记事本上的内容，再Ctrl-V到Vscode里面。

以前一般有格式问题，比如字体字号之类的，张小白只要按照这个办法，相应的格式就会消失。那么，这种办法有效吗？

我们再预览下：

一点用都没有。即便是记事本，也会将C2 A0原封不动的拷贝过去。还是无杠青年。

当然有一种办法，就是你贴到记事本的时候，将空格删掉再重打一遍，不过这个跟你贴到VsCode后删掉空格再重打一遍空格又有何区别呢？

看来使用快捷键或工具来转换C2 A0的方法似乎没用，张小白又找了一些代码转换的方法，如：

Python代码转换法：代码convert.py

# -*- coding:utf-8 -*- import os import sys import io reload(sys) sys.setdefaultencoding('utf-8') #打开源文件，读取内容 org_file=open("C:\Users\zhang\Desktop\space.html","r") org_str=org_file.read() #替换为空格 dest_str=org_str.replace(u"\xa0", u'\x20') #注意，此处"\xa0"不能输入为"\xc2\xa0"！ #print(dest_str) #打开目的文件，写入替换后的内容 dest_file=io.open("C:\Users\zhang\Desktop\space-converted.html","w",encoding="utf-8") dest_file.write(dest_str)

在VsCode中执行：

打开生成后的代码：space-converted.html 使用hexdump查看：

浏览器预览都可以了：

参考文件：

1：《C2 A0 特殊空格》 https://www.yangdx.com/2019/12/74.html

2：《C2 A0 不可见字符到底是什么？半角非中断空格》https://blog.csdn.net/qfzhangwei/article/details/89505441

3：《关于替换“c2a0”十六进制字符的方法》https://blog.csdn.net/ampt4027/article/details/101244505

4：《【copy攻城狮日志】斜杠去哪儿了？聊聊前端中进制》https://bbs.huaweicloud.com/forum/thread-66351-1-1.html

HTML5

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。