零寬空格等控制字符的作用和代碼處理

零寬空格的實現(xiàn)原理

零寬空格（Zero Width Space, ZWSP）是一個特殊的Unicode字符，編碼為U+200B。它是一個不可見的字符，其寬度為零，不占用任何可見空間。在文本處理系統(tǒng)中，盡管它在視覺上是不可見的，但它在文本中確實存在，并可以作為潛在的斷點，即允許在此位置斷開行。這意味著如果一行文本過長需要自動換行時，文本可以在零寬空格的位置進(jìn)行折行，而不影響單詞的完整性。

應(yīng)用場景

文本格式化和斷行控制：
在不允許在單詞內(nèi)自動換行的語言或特定格式中，零寬空格可以插入到長單詞或URL中，允許這些文本在不影響閱讀的情況下進(jìn)行合適的換行。
在HTML和其他Web內(nèi)容中，零寬空格常用于長無空格字符串的斷行控制。
隱秘標(biāo)記和文本隱藏：
零寬空格可以用于在文本中隱藏信息，因為它在視覺上不可見。例如，可以通過在特定位置插入零寬空格來編碼額外信息，這種技術(shù)有時用于數(shù)字水印或隱藏的標(biāo)記。
在某些安全領(lǐng)域，零寬字符用于對抗自動文本分析工具，通過在文本中嵌入這些字符來“污染”數(shù)據(jù)，使自動處理變得更困難。
程序和網(wǎng)頁開發(fā)：
在編程中，特別是在Web開發(fā)中，零寬空格可以幫助處理和顯示不斷行的長字符串，如路徑或特定代碼段。
在用戶界面開發(fā)中，零寬空格可以用來調(diào)整或微調(diào)文本顯示，盡管這通常不是最佳實踐。
排版和設(shè)計：
在復(fù)雜的排版設(shè)計中，設(shè)計師可能使用零寬空格來精確控制文本的布局和行間距，尤其是在多語言排版中。
在電子書和PDF文檔中，零寬空格可以幫助實現(xiàn)更優(yōu)雅的文本格式，尤其是在處理多種語言和腳本時。

注意事項

雖然零寬空格在許多情況下都是有用的，但它也可能引起問題，特別是在文本處理和數(shù)據(jù)清洗中。不注意這些看不見的字符可能導(dǎo)致數(shù)據(jù)的意外錯誤、搜索失敗、數(shù)據(jù)不一致等問題。因此，在處理來自不同源的文本數(shù)據(jù)時，了解和考慮這些不可見字符是非常重要的。

2 在Python中處理零寬空格

（Zero Width Space, Unicode編碼為U+200B）通?？梢酝ㄟ^字符串的替換操作來實現(xiàn)。這里有幾種常見的方法來去除字符串中的零寬空格：

方法1: 使用str.replace()

str.replace() 方法是去除字符串中特定字符的一種直接方式。你可以使用它來替換零寬空格為一個空字符串：

original_string = "This is a test\u200b string with zero width space."
cleaned_string = original_string.replace('\u200b', '')
print(cleaned_string)

這個方法將去除字符串中所有的零寬空格。

方法2: 使用正則表達(dá)式

如果你需要去除字符串中的多種不可見字符，包括零寬空格，使用正則表達(dá)式是一個更強大的選擇。Python的 re 模塊可以幫助實現(xiàn)這一功能：

import re

original_string = "This is a test\u200b string with zero width space."
cleaned_string = re.sub(r'\u200b', '', original_string)
print(cleaned_string)

這個方法同樣可以針對多種類型的不可見字符進(jìn)行調(diào)整，只需修改正則表達(dá)式即可。

方法3: 使用translate()

另一個選項是使用字符串的 translate() 方法。這種方法可以在一個步驟中刪除字符串中的多個不同類型的字符：

original_string = "This is a test\u200b string with zero width space."
remove_chars = dict.fromkeys([0x200b], None)
cleaned_string = original_string.translate(remove_chars)
print(cleaned_string)

這里，我們創(chuàng)建了一個字典，指定要刪除的字符（零寬空格的Unicode編碼是0x200B）映射到 None，這意味著這些字符將被刪除。

方法4: 清除所有Unicode控制字符

去除字符串中所有的Unicode控制字符（包括但不限于零寬空格），可以使用更通用的正則表達(dá)式：

import re

original_string = "This is a test\u200b string with zero width space."
cleaned_string = re.sub(r'[\u200B-\u200D\uFEFF]', '', original_string)
print(cleaned_string)

這里，正則表達(dá)式涵蓋了多個常見的Unicode控制字符。

3 常見的Unicode控制字符

在 Unicode 中，\u200B, \u200C, \u200D 以及 \uFEFF 分別代表一些特定的不可見字符，它們的用途和行為在文本處理中各有不同。這里是每個字符的詳細(xì)說明：

\u200B - 零寬空格 (Zero Width Space, ZWS)

Unicode 編碼：U+200B
描述：一個不可見的分隔符，不占任何空間，用于可能的換行點。它允許在其點處斷行，而不顯示任何字符。

\u200C - 零寬非連接符 (Zero Width Non-Joiner, ZWNJ)

Unicode 編碼：U+200C
描述：在需要字符獨立顯示而不是與前后字符聯(lián)合時使用。在一些書寫系統(tǒng)如阿拉伯語和波斯語中非常有用，用于控制字符的連寫表現(xiàn)。

\u200D - 零寬連接符 (Zero Width Joiner, ZWJ)

Unicode 編碼：U+200D
描述：用于促使兩個字符生成一個單獨的合成字符。常用于一些復(fù)雜書寫系統(tǒng)的特定字形顯示，或在新興的表情符號序列中，如家庭組合或膚色變化的表情符號。

\uFEFF - 字節(jié)順序標(biāo)記 (Byte Order Mark, BOM)

Unicode 編碼：U+FEFF
描述：在 UTF-16 和 UTF-32 的編碼序列中用作字節(jié)序的標(biāo)記。在 UTF-8 中，雖然不必要，但有時用作標(biāo)識文件是以 UTF-8 編碼的標(biāo)記。當(dāng)用作普通文本中時，它通常被視為零寬不換行空格 (Zero Width No-Break Space)。

用途和影響

這些字符在現(xiàn)代文本處理和網(wǎng)絡(luò)內(nèi)容中扮演著關(guān)鍵角色，尤其是在多語言和多腳本環(huán)境中，它們幫助實現(xiàn)了細(xì)微的文本格式控制和視覺表現(xiàn)。然而，它們也可能導(dǎo)致文本處理上的問題，比如字符串匹配失敗、文本渲染異常等，因此在處理文本數(shù)據(jù)時需要特別注意這些不可見字符的存在。在數(shù)據(jù)清洗和預(yù)處理階段移除或適當(dāng)處理這些字符，是確保數(shù)據(jù)質(zhì)量和應(yīng)用穩(wěn)定性的重要步驟。

TML: HyperText Markup Language 超文本標(biāo)記語言

HTML代碼不區(qū)分大小寫, 包括HTML標(biāo)記、屬性、屬性值都不區(qū)分大小寫;

任何空格或回車鍵在代碼中都無效，插入空格或回車有專用的標(biāo)記，分別是、

HTML標(biāo)記中不要有空格，否則瀏覽器可能無法識別。

如何添加注釋(comment:評論;注釋)

<!-- -->
<comment></comment>
<!-- --> 不能留有空格

字符集

<meta http-equiv="Content-Type" content="text/html;charset=#"/>

<base target="_blank">

可以將a鏈接的默認(rèn)屬性設(shè)置為_blank屬性

單個標(biāo)簽要有最好有結(jié)束符(可以沒有結(jié)束符)

<br/> <img src="" width="" />

便于兼容XHTML(XHTML必須要有結(jié)束符)

HTML標(biāo)簽的屬性值可以有引號,可以沒有引號,為了提高代碼的可讀性,推薦使用引號(單引號和雙引號)，盡管屬性值是整數(shù)，也推薦加上引號。

<marquee behavior="slide"></marquee>

便于兼容XHTML(XHTML必須要有引號)

<marquee behavior=slide></marquee>

經(jīng)過測試,以上程序都可以正確運行

HTML標(biāo)簽涉及到的顏色值格式:

color_name 規(guī)定顏色值為顏色名稱的文本顏色(比如 "red")。

hex_number 規(guī)定顏色值為十六進(jìn)制值的文本顏色(比如 "#ff0000")。

rgb_number 規(guī)定顏色值為 rgb 代碼的文本顏色(比如 "rgb(255,0,0)")。

transparent 透明色 color:transparent

rgba(紅0-255,綠0-255,藍(lán)0-255,透明度0-1)

opacity屬性: 就是葫蘆娃兄弟老六(技能包隱身)

css:

div{opacity:0.1} /*取值為0-1*/

英文(顏色值)不區(qū)分大小寫

HTML中顏色值：采用十六進(jìn)制兼容性最好(十六進(jìn)制顯示顏色效果最佳)

CSS中顏色值：不存在兼容性

紅色 #FF0000

綠色 #00FF00

藍(lán)色 #0000FF

黑色： #000000

灰色 #CCCCCC

白色 #FFFFFF

青色 #00FFFF

洋紅 #FF00FF

黃色 #FFFF00

請問后綴 html 和 htm 有什么區(qū)別?

答: 1. 如果一個網(wǎng)站有 index.html和index.htm，默認(rèn)情況下，優(yōu)先訪問.html

2. htm后綴是為了兼容以前的DOS系統(tǒng)8.3的命名規(guī)范

XHTML與HTML之間的關(guān)系?

XHTML是EXtensible HyperText Markup Language的英文縮寫,即可擴展的超文本標(biāo)記語言.

XHTML語言是一種標(biāo)記語言,它不需要編譯,可以直接由瀏覽器執(zhí)行.

XHTML是用來代替HTML的, 是2000年w3c公布發(fā)行的.

XHTML是一種增強了的HTML,它的可擴展性和靈活性將適應(yīng)未來網(wǎng)絡(luò)應(yīng)用更多的需求.

XHTML是基于XML的應(yīng)用.

XHTML更簡潔更嚴(yán)謹(jǐn).

XHTML也可以說就是HTML一個升級版本.(w3c描述它為'HTML 4.01')

XHTML是大小寫敏感的,XHTML與HTML是不一樣的;HTML不區(qū)分大小寫,標(biāo)準(zhǔn)的XHTML標(biāo)簽應(yīng)該使用小寫.

XHTML屬性值必須使用引號,而HTML屬性值可用引號,可不要引號

XHTML屬性不能簡寫：如checked必須寫成checked="checked"

單標(biāo)記 , XHTML必須有結(jié)束符 ,而HTML可以使用 ,也可以使用

除此之外XHTML和HTML基本相同.

網(wǎng)頁寬度設(shè)置多少為最佳?

960px

target屬性值理解

_self 在當(dāng)前窗口中打開鏈接文件,是默認(rèn)值

_blank 開啟一個新的窗口打開鏈接文件

_parent 在父級窗口中打開文件,常用于框架頁面

_top 在頂層窗口中打開文件,常用語框架頁面

字符集：

charset=utf-8

Gb2312 簡單中文字符集, 最常用的中文字符

Gbk 簡繁體字符集, 中文字符集

Big5 繁體字符集, 臺灣等等

Utf-8 世界性語言的字符集

ANSI編碼格式編碼格式的擴展字符集有g(shù)b2312和gbk

單位問題：

HTML屬性值數(shù)值型的一般不帶單位, CSS必須帶單位;

強制刷新

ctrl+F5

解如何在 JavaScript 中輕松地在字符串的字符之間添加空格。

在本文中，我們將學(xué)習(xí)如何在 JavaScript 中輕松地在字符串的字符之間包含空格。

1. String split() 和 Split join() 方法

要在字符串的字符之間添加空格，請在字符串上調(diào)用 split() 方法以獲取字符數(shù)組，然后在數(shù)組上調(diào)用 join() 方法以使用空格分隔符連接字符。

例如：

function addSpace(str) {
  return str.split('').join(' ');
}const str1 = 'coffee';
const str2 = 'banana';console.log(addSpace(str1)); // c o f f e e
console.log(addSpace(str2)); // b a n a n a

String split() 方法使用指定的分隔符將字符串拆分為子字符串?dāng)?shù)組。

const str1 = 'coffee,milk,tea';
const str2 = 'sun-moon-star';console.log(str1.split(',')); // [ 'coffee', 'milk', 'tea' ]
console.log(str2.split('-')); // [ 'sun', 'moon', 'star' ]

通過使用空字符串 ('') 作為分隔符，我們將所有字符串字符拆分為單獨的數(shù)組元素。

const str1 = 'coffee';
const str2 = 'banana';// Passing an empty string ('') to the split method// [ 'c', 'o', 'f', 'f', 'e', 'e' ]
console.log(str1.split(''));// [ 'b', 'a', 'n', 'a', 'n', 'a' ]
console.log(str2.split(''));

String join() 方法將數(shù)組中的每個字符串與分隔符組合在一起。它返回一個包含連接數(shù)組元素的新字符串。

const arr = ['a', 'b', 'c', 'd'];console.log(arr.join(' ')); // a b c d
console.log(arr.join('-')); // a-b-c-d
console.log(arr.join('/')); // a/b/c/d

因此，將空格字符傳遞給 join() 會在結(jié)果串聯(lián)中用空格分隔字符。

在某些情況下，字符串已經(jīng)在某些字符之間包含空格。在這種情況下，我們的方法會在字符之間添加更多空格。

function addSpace(str) {
  return str.split('').join(' ');
}// These strings have spaces between some characters
const str1 = 'co  ffee';
const str2 = 'bana  na';console.log(addSpace(str1)); // c o     f f e e
console.log(addSpace(str2)); // b a n a     n a

這是因為空格 (' ') 也是一個字符，就像一個字母，調(diào)用 split() 會使其成為數(shù)組中的一個單獨元素，該元素將與其他空格組合。

// These strings have spaces between some characters
const str1 = 'co  ffee';
const str2 = 'bana  na';// The space characters are separate elements of the
// array from split()
/**
 * [
  'c', 'o', ' ',
  ' ', 'f', 'f',
  'e', 'e'
]
 */
console.log(str1.split(''));/**
 * [
  'b', 'a', 'n',
  'a', ' ', ' ',
  'n', 'a'
]
 */
console.log(str2.split(''));

如果我們想避免字符的多個間距，我們可以在 split() 和 join() 之間插入對 filter() 方法的調(diào)用。

function addSpace(str) {
  return str
    .split('')
    .filter((item) => item.trim())
    .join(' ');
}// The strings have spaces between some characters
const str1 = 'co  ffee';
const str2 = 'bana  na';console.log(addSpace(str1)); // c o f f e e
console.log(addSpace(str2)); // b a n a n a

Array filter() 方法返回一個新數(shù)組，該數(shù)組僅包含原始數(shù)組中的元素，傳遞給 filter() 的測試回調(diào)函數(shù)為其返回真值。對空格 (' ') 調(diào)用 trim() 會產(chǎn)生一個空字符串 ('')，這在 JavaScript 中不是真值。因此，從 filter() 返回的結(jié)果數(shù)組中排除了空格。

小費

在 JavaScript 中，只有六個假值：false、null、undefined、0、''（空字符串）和 NaN。其他所有值都是真實的。

2. for...of 循環(huán)

對于更命令式的方法，我們可以使用 JavaScript for...of 循環(huán)在字符串的字符之間添加一個空格。

function addSpace(str) {
  // Create a variable to store the eventual result
  let result = '';  for (const char of str) {
    // On each iteration, add the character and a space
    // to the variable
    result += char + ' ';
  }  // Remove the space from the last character
  return result.trimEnd();
}const str1 = 'coffee';
const str2 = 'banana';console.log(addSpace(str1)); // c o f f e e
console.log(addSpace(str2)); // b a n a n a

為了處理前面討論的場景，其中字符串在某些字符之間有空格，請在每次迭代的字符上調(diào)用 trim()，并添加一個 if 檢查以確保它是真實的，然后將它和空格添加到累積結(jié)果中：

function addSpace(str) {
  // Create a variable to store the eventual result
  let result = '';  for (const char of str) {
    // On each iteration, add the character and a space
    // to the variable    // If the character is a space, trim it to an empty
    // string, then only add it if it is truthy
    if (char.trim()) {
      result += char + ' ';
    }
  }  // Remove the space from the last character
  return result.trimEnd();
}const str1 = 'co  ffee';
const str2 = 'bana  na';console.log(addSpace(str1)); // c o f f e e
console.log(addSpace(str2)); // b a n a n a

關(guān)注七爪網(wǎng)，獲取更多APP/小程序/網(wǎng)站源碼資源！

在線咨詢

上一篇：跨境電商賣家如何制作圖文并茂的HTML郵件，做好EDM營銷
下一篇：CSS 星星評分器效果 #web前端

您的項目需求

*請認(rèn)真填寫需求信息，我們會在24小時內(nèi)與您取得聯(lián)系。

整合營銷服務(wù)商