哪个商城网站建设好,手机棋牌游戏平台,个人博客平台,中小型企业网站优化价格现在我们来实现一键删除所有空格的功能。
一、使用原有的代码来实现#xff0c;测试效果并不理想
在这之前我们已经为String对象编写了一个使用正则表达式来删除所有空格的方法#xff1a;
//功能#xff1a;删除字符串中的所有空格
//记录#xff1a;20230726创建
Stri…现在我们来实现一键删除所有空格的功能。
一、使用原有的代码来实现测试效果并不理想
在这之前我们已经为String对象编写了一个使用正则表达式来删除所有空格的方法
//功能删除字符串中的所有空格
//记录20230726创建
String.prototype.eliminateSpace function()
{return this.replace(/\s*/g,);
}我们使用它构建了一个测试网页
!DOCTYPE HTML
HTML
headmeta http-equivContent-Type contenttext/html; charsetutf-8 /meta nameAuthor contentPurpleEndurertitle公文一键排版系统/title
/head
body
fieldset stylewidth: 1100px;legend实时编辑区/legendiframe ideditor width1200px height400px styleborder: solid 1px;/iframe
/fieldset
Pinput typebutton idbtnDelBlank value删除空格 onclickedRichBody.innerTextdelBlankText(edRichBody.innerText); stylebackground:#9999cc; color:white; border-radius: 25px; /
/pp调试信息/p
textarea idtaDbg stylewidth: 1225px; height: 200px调试信息/textareascriptconst edRich document.getElementById(editor);
const taDbg document.getElementById(taDbg);
var edRichDoc;
var edRichBody;if (typeof(edRich) ! undefined){edRichDoc edRich.contentWindow.document;edRichDoc.designMode on;edRichDoc.contentEditable true;edRichBody edRichDoc.body;edRichBody.innerHTML pa hrefhttp://blog.csdn.net/purpleendurerhttp://blog.csdn.net/purpleendurer/a/pp/pp stylefont-family:方正小标宋简体;font-size:22pt; text-align:center; line-height:28pt;p aligncenter styletext-align:center;text-indent:24.0pt;line-height:28.0ptspan langEN-US stylefont-size:22.0pt;font-family:方正小标宋简体;mso-hansi-font-family:黑体;color:blackSQL/spanspan stylefont-size:22.0pt;font-family:方正小标宋简体;mso-hansi-font-family:黑体;color:black注入基础span langEN-USo:p/o:p/span/span/pp styletext-indent:2em;河池市××局、 市×× 局 /pp styletext-indent:24.0pt;line-height:28.0pt;font-variant-ligatures: normal;font-variant-caps: normal;orphans: 2;text-align:start;widows: 2;-webkit-text-stroke-width: 0px;text-decoration-thickness: initial;text-decoration-style: initial;text-decoration-color: initial;word-spacing:0pxspan stylefont-size:16.0pt;font-family:黑体;color:black一、span langEN-USSQL/span注入分类span langEN-USo:p/o:p/span/span/pp styletext-indent:24.0pt;line-height:28.0pt;font-variant-ligatures: normal;font-variant-caps: normal;orphans: 2;text-align:start;widows: 2;-webkit-text-stroke-width: 0px;text-decoration-thickness: initial;text-decoration-style: initial;text-decoration-color: initial;word-spacing:0pxbspan stylefont-size:16.0pt;font-family:楷体_GB2312;color:black一什么是span langEN-USSQL/span注入span langEN-US?o:p/o:p/span/span/b/pp styletext-indent:24.0pt;line-height:28.0pt;font-variant-ligatures: normal;font-variant-caps: normal;orphans: 2;text-align:start;widows: 2;-webkit-text-stroke-width: 0px;text-decoration-thickness: initial;text-decoration-style: initial;text-decoration-color: initial;word-spacing:0pxspan langEN-US stylefont-size:16.0pt;font-family:仿宋_GB2312;color:blackSLQ/spanspan stylefont-size:16.0pt;font-family:仿宋_GB2312;color:black注入span langEN-US(/span英文span langEN-US: Sqlinject)/span当span langEN-USweb/span应用向后台数据库传递span langEN-USSQL/span语句进行数据库操作时如果对用户输入的参数没有经过严格的过滤那么用户可以构造特殊的span langEN-USsq1/span语句从而带入到数据库中执行获取或修改数据库中的数据。span langEN-USo:p/o:p/span/span/pp styletext-indent:24.0pt;line-height:28.0pt;font-variant-ligatures: normal;font-variant-caps: normal;orphans: 2;text-align:start;widows: 2;-webkit-text-stroke-width: 0px;text-decoration-thickness: initial;text-decoration-style: initial;text-decoration-color: initial;word-spacing:0pxspan stylefont-size:16.0pt;color:blacknbsp;nbsp;1.加强技术学习。一要span langEN-USo:p/o:p/span/span/pp styletext-indent:24.0pt;line-height:28.0pt;font-variant-ligatures: normal;font-variant-caps: normal;orphans: 2;text-align:start;widows: 2;-webkit-text-stroke-width: 0px;text-decoration-thickness: initial;text-decoration-style: initial;text-decoration-color: initial;word-spacing:0pxspan stylefont-size:16.0pt;color:blacknbsp;nbsp;2.强化安全保障。一要。span langEN-USo:p/o:p/span/span/pp附件河池市××关于××××××××××××××××××××××××××××××××××××××××××××××××××的通知/pp附件:河池市××关于××的通知/pp附件河池市××关于××的通知。/pp附件1.河池市××关于××的通 知/pp附件1河池市××关于××××的通 知 /pp2河池市××关于×× ××的通 知 /pp3河池市××关于×× ××的通 知/pp测试1/pp styletext-indent:24.0pt;line-height:28.0pt;font-variant-ligatures: normal;font-variant-caps: normal;orphans: 2;text-align:start;widows: 2;-webkit-text-stroke-width: 0px;text-decoration-thickness: initial;text-decoration-style: initial;text-decoration-color: initial;word-spacing:0px河池市××××局/pp2023年7月22日/pp测试2/pp广西壮族自治区河池市××××局/pp2023年7月22日/pp测试3/pp河池市××局/pp2023年7月22日/pp测试4/pp河池市×局/pp2023年7月22日/pp附件/pp附件标题/pp附件/pp附件标题/pp附 件/pp附件标题/p;
}
else
{window.alert(undefined);
} //功能删除字符串中的所有空格
//记录20230726创建
String.prototype.eliminateSpace function()
{return this.replace(/\s*/g,);
}//功能删除给字符串中的所有半角和全角空格
//输入p字符串
//输出删除所有半角和全角空格后的字符串
//记录20230804创建
function delBlankText(p)
{return p.eliminateSpace();//return p.eliminateBlank();
}//delBlankTextfunction showSrc()
{if (btnShowSrc.value显示源码){edRichBody.innerText edRichBody.innerHTML;//edRichBody.innerText edRichBody.innerHTML.replace(/p,/pchr(10)); //edRichBody.innerText edRichBody.innerText.replace(\/p,\/pchr(10)chr(13)); btnShowSrc.value 显示预览;btnShowSrc.style.background cyan;}else{edRichBody.innerHTML edRichBody.innerText;//edRichBody.innerHTML edRichBody.innerText.replace(chr(10)chr(13),);btnShowSrc.value 显示源码;btnShowSrc.style.background yellow;}
}
/script
/body
/html
其中通过点击“删除空格”按钮 来将edRichBody.innerText中的空格 删除 input typebutton idbtnDelBlank value删除空格 onclickedRichBody.innerTextdelBlankText(edRichBody.innerText); stylebackground:#9999cc; color:white; border-radius: 25px; /
运行效果如下 空格确实都去掉了但多段文字变成一行文字因为在正则表达式中\s除了匹配空格也匹配制表符和换行符。
二、从新出发构建新方法删除全角、半角空格和制表符
那么我们需要再写一个删除半角空格、全角空格和制表符的方法
//功能删除字符串中的所有半角和全角空格
//记录20230805创建
String.prototype.eliminateBlank function()
{return this.replace(/ \t/g,);
}
再进行测试
!DOCTYPE HTML
HTML
headmeta http-equivContent-Type contenttext/html; charsetutf-8 /meta nameAuthor contentPurpleEndurertitle公文一键排版系统/title
/head
body
fieldset stylewidth: 1100px;legend实时编辑区/legendiframe ideditor width1200px height400px styleborder: solid 1px;/iframe
/fieldset
Pinput typebutton idbtnDelBlank value删除空格 onclickedRichBody.innerTextdelBlankText(edRichBody.innerText); stylebackground:#9999cc; color:white; border-radius: 25px; /input typebutton idbtnShowSrc value显示源码 onclickshowSrc() stylebackground:yellow; border-radius: 25px; /
/pp调试信息/p
textarea idtaDbg stylewidth: 1225px; height: 200px调试信息/textareascriptconst edRich document.getElementById(editor);
const taDbg document.getElementById(taDbg);
var edRichDoc;
var edRichBody;if (typeof(edRich) ! undefined){edRichDoc edRich.contentWindow.document;edRichDoc.designMode on;edRichDoc.contentEditable true;edRichBody edRichDoc.body;edRichBody.innerHTML pa hrefhttp://blog.csdn.net/purpleendurerhttp://blog.csdn.net/purpleendurer/a/pp/pp stylefont-family:方正小标宋简体;font-size:22pt; text-align:center; line-height:28pt;p aligncenter styletext-align:center;text-indent:24.0pt;line-height:28.0ptspan langEN-US stylefont-size:22.0pt;font-family:方正小标宋简体;mso-hansi-font-family:黑体;color:blackSQL/spanspan stylefont-size:22.0pt;font-family:方正小标宋简体;mso-hansi-font-family:黑体;color:black注入基础span langEN-USo:p/o:p/span/span/pp styletext-indent:2em;河池市××局、 市×× 局 /pp styletext-indent:24.0pt;line-height:28.0pt;font-variant-ligatures: normal;font-variant-caps: normal;orphans: 2;text-align:start;widows: 2;-webkit-text-stroke-width: 0px;text-decoration-thickness: initial;text-decoration-style: initial;text-decoration-color: initial;word-spacing:0pxspan stylefont-size:16.0pt;font-family:黑体;color:black一、span langEN-USSQL/span注入分类span langEN-USo:p/o:p/span/span/pp styletext-indent:24.0pt;line-height:28.0pt;font-variant-ligatures: normal;font-variant-caps: normal;orphans: 2;text-align:start;widows: 2;-webkit-text-stroke-width: 0px;text-decoration-thickness: initial;text-decoration-style: initial;text-decoration-color: initial;word-spacing:0pxbspan stylefont-size:16.0pt;font-family:楷体_GB2312;color:black一什么是span langEN-USSQL/span注入span langEN-US?o:p/o:p/span/span/b/pp styletext-indent:24.0pt;line-height:28.0pt;font-variant-ligatures: normal;font-variant-caps: normal;orphans: 2;text-align:start;widows: 2;-webkit-text-stroke-width: 0px;text-decoration-thickness: initial;text-decoration-style: initial;text-decoration-color: initial;word-spacing:0pxspan langEN-US stylefont-size:16.0pt;font-family:仿宋_GB2312;color:blackSLQ/spanspan stylefont-size:16.0pt;font-family:仿宋_GB2312;color:black注入span langEN-US(/span英文span langEN-US: Sqlinject)/span当span langEN-USweb/span应用向后台数据库传递span langEN-USSQL/span语句进行数据库操作时如果对用户输入的参数没有经过严格的过滤那么用户可以构造特殊的span langEN-USsq1/span语句从而带入到数据库中执行获取或修改数据库中的数据。span langEN-USo:p/o:p/span/span/pp styletext-indent:24.0pt;line-height:28.0pt;font-variant-ligatures: normal;font-variant-caps: normal;orphans: 2;text-align:start;widows: 2;-webkit-text-stroke-width: 0px;text-decoration-thickness: initial;text-decoration-style: initial;text-decoration-color: initial;word-spacing:0pxspan stylefont-size:16.0pt;color:blacknbsp;nbsp;1.加强技术学习。一要span langEN-USo:p/o:p/span/span/pp styletext-indent:24.0pt;line-height:28.0pt;font-variant-ligatures: normal;font-variant-caps: normal;orphans: 2;text-align:start;widows: 2;-webkit-text-stroke-width: 0px;text-decoration-thickness: initial;text-decoration-style: initial;text-decoration-color: initial;word-spacing:0pxspan stylefont-size:16.0pt;color:blacknbsp;nbsp;2.强化安全保障。一要。span langEN-USo:p/o:p/span/span/pp附件河池市××关于××××××××××××××××××××××××××××××××××××××××××××××××××的通知/pp附件:河池市××关于××的通知/pp附件河池市××关于××的通知。/pp附件1.河池市××关于××的通 知/pp附件1河池市××关于××××的通 知 /pp2河池市××关于×× ××的通 知 /pp3河池市××关于×× ××的通 知/pp测试1/pp styletext-indent:24.0pt;line-height:28.0pt;font-variant-ligatures: normal;font-variant-caps: normal;orphans: 2;text-align:start;widows: 2;-webkit-text-stroke-width: 0px;text-decoration-thickness: initial;text-decoration-style: initial;text-decoration-color: initial;word-spacing:0px河池市××××局/pp2023年7月22日/pp测试2/pp广西壮族自治区河池市××××局/pp2023年7月22日/pp测试3/pp河池市××局/pp2023年7月22日/pp测试4/pp河池市×局/pp2023年7月22日/pp附件/pp附件标题/pp附件/pp附件标题/pp附 件/pp附件标题/p;
}
else
{window.alert(undefined);
}//功能删除字符串中的所有空格
//记录20230726创建
//String.prototype.eliminateSpace function()
//{
// return this.replace(/\s*/g,);
//}//功能删除字符串中的所有半角和全角空格
//记录20230805创建
String.prototype.eliminateBlank function()
{return this.replace(/ \t/g,);
}//功能删除给字符串中的所有半角和全角空格
//输入p字符串
//输出删除所有半角和全角空格后的字符串
//记录20230804创建
function delBlankText(p)
{//return p.eliminateSpace();return p.eliminateBlank();
}//delBlankTextfunction showSrc()
{if (btnShowSrc.value显示源码){edRichBody.innerText edRichBody.innerHTML;btnShowSrc.value 显示预览;btnShowSrc.style.background cyan;}else{edRichBody.innerHTML edRichBody.innerText;btnShowSrc.value 显示源码;btnShowSrc.style.background yellow;}
}
/script
/body
/html
代码运行效果如下 测试发现半角、全角空格都被删除了但HTML代码nbsp;代表的空格并没有被删除。
三、再写一个删除HTML代码 nbsp;代码的空格的方法
所以我们还要为String对象再写一个删除HTML代码nbsp;代表的空格的方法
//功能删除字符串中的nbsp;
//记录20230805创建
String.prototype.eliminateNbsp function()
{return this.replace(/nbsp;/ig,);
}
由于nbsp;是HTML的代码所以要同时修改“删除空格”按钮 的功能代码 input typebutton idbtnDelBlank value删除空格 onclickedRichBody.innerTextdelBlankText(edRichBody.innerText);edRichBody.innerHTMLdelBlankHTML(edRichBody.innerHTML) stylebackground:#9999cc; color:white; border-radius: 25px; /完整的测试代码如下
!DOCTYPE HTML
HTML
headmeta http-equivContent-Type contenttext/html; charsetutf-8 /meta nameAuthor contentPurpleEndurertitle公文一键排版系统/title
/head
body
fieldset stylewidth: 1100px;legend实时编辑区/legendiframe ideditor width1200px height400px styleborder: solid 1px;/iframe
/fieldset
P
!--input typebutton idbtnDelBlank value删除空格 onclickedRichBody.innerTextdelBlankText(edRichBody.innerText); stylebackground:#9999cc; color:white; border-radius: 25px; /
//--input typebutton idbtnDelBlank value删除空格 onclickedRichBody.innerTextdelBlankText(edRichBody.innerText);edRichBody.innerHTMLdelBlankHTML(edRichBody.innerHTML) stylebackground:#9999cc; color:white; border-radius: 25px; /input typebutton idbtnShowSrc value显示源码 onclickshowSrc() stylebackground:yellow; border-radius: 25px; /
/pp调试信息/p
textarea idtaDbg stylewidth: 1225px; height: 200px调试信息/textareascriptconst edRich document.getElementById(editor);
const taDbg document.getElementById(taDbg);
var edRichDoc;
var edRichBody;if (typeof(edRich) ! undefined){edRichDoc edRich.contentWindow.document;edRichDoc.designMode on;edRichDoc.contentEditable true;edRichBody edRichDoc.body;edRichBody.innerHTML pa hrefhttp://blog.csdn.net/purpleendurerhttp://blog.csdn.net/purpleendurer/a/pp/pp stylefont-family:方正小标宋简体;font-size:22pt; text-align:center; line-height:28pt;p aligncenter styletext-align:center;text-indent:24.0pt;line-height:28.0ptspan langEN-US stylefont-size:22.0pt;font-family:方正小标宋简体;mso-hansi-font-family:黑体;color:blackSQL/spanspan stylefont-size:22.0pt;font-family:方正小标宋简体;mso-hansi-font-family:黑体;color:black注入基础span langEN-USo:p/o:p/span/span/pp styletext-indent:2em;河池市××局、 市×× 局 /pp styletext-indent:24.0pt;line-height:28.0pt;font-variant-ligatures: normal;font-variant-caps: normal;orphans: 2;text-align:start;widows: 2;-webkit-text-stroke-width: 0px;text-decoration-thickness: initial;text-decoration-style: initial;text-decoration-color: initial;word-spacing:0pxspan stylefont-size:16.0pt;font-family:黑体;color:black一、span langEN-USSQL/span注入分类span langEN-USo:p/o:p/span/span/pp styletext-indent:24.0pt;line-height:28.0pt;font-variant-ligatures: normal;font-variant-caps: normal;orphans: 2;text-align:start;widows: 2;-webkit-text-stroke-width: 0px;text-decoration-thickness: initial;text-decoration-style: initial;text-decoration-color: initial;word-spacing:0pxbspan stylefont-size:16.0pt;font-family:楷体_GB2312;color:black一什么是span langEN-USSQL/span注入span langEN-US?o:p/o:p/span/span/b/pp styletext-indent:24.0pt;line-height:28.0pt;font-variant-ligatures: normal;font-variant-caps: normal;orphans: 2;text-align:start;widows: 2;-webkit-text-stroke-width: 0px;text-decoration-thickness: initial;text-decoration-style: initial;text-decoration-color: initial;word-spacing:0pxspan langEN-US stylefont-size:16.0pt;font-family:仿宋_GB2312;color:blackSLQ/spanspan stylefont-size:16.0pt;font-family:仿宋_GB2312;color:black注入span langEN-US(/span英文span langEN-US: Sqlinject)/span当span langEN-USweb/span应用向后台数据库传递span langEN-USSQL/span语句进行数据库操作时如果对用户输入的参数没有经过严格的过滤那么用户可以构造特殊的span langEN-USsq1/span语句从而带入到数据库中执行获取或修改数据库中的数据。span langEN-USo:p/o:p/span/span/pp styletext-indent:24.0pt;line-height:28.0pt;font-variant-ligatures: normal;font-variant-caps: normal;orphans: 2;text-align:start;widows: 2;-webkit-text-stroke-width: 0px;text-decoration-thickness: initial;text-decoration-style: initial;text-decoration-color: initial;word-spacing:0pxspan stylefont-size:16.0pt;color:blacknbsp;nbsp;1.加强技术学习。一要span langEN-USo:p/o:p/span/span/pp styletext-indent:24.0pt;line-height:28.0pt;font-variant-ligatures: normal;font-variant-caps: normal;orphans: 2;text-align:start;widows: 2;-webkit-text-stroke-width: 0px;text-decoration-thickness: initial;text-decoration-style: initial;text-decoration-color: initial;word-spacing:0pxspan stylefont-size:16.0pt;color:blacknbsp;nbsp;2.强化安全保障。一要。span langEN-USo:p/o:p/span/span/pp附件河池市××关于××××××××××××××××××××××××××××××××××××××××××××××××××的通知/pp附件:河池市××关于××的通知/pp附件河池市××关于××的通知。/pp附件1.河池市××关于××的通 知/pp附件1河池市××关于××××的通 知 /pp2河池市××关于×× ××的通 知 /pp3河池市××关于×× ××的通 知/pp测试1/pp styletext-indent:24.0pt;line-height:28.0pt;font-variant-ligatures: normal;font-variant-caps: normal;orphans: 2;text-align:start;widows: 2;-webkit-text-stroke-width: 0px;text-decoration-thickness: initial;text-decoration-style: initial;text-decoration-color: initial;word-spacing:0px河池市××××局/pp2023年7月22日/pp测试2/pp广西壮族自治区河池市××××局/pp2023年7月22日/pp测试3/pp河池市××局/pp2023年7月22日/pp测试4/pp河池市×局/pp2023年7月22日/pp附件/pp附件标题/pp附件/pp附件标题/pp附 件/pp附件标题/p;
}
else
{window.alert(undefined);
}//功能删除字符串中的所有空格
//记录20230726创建
//String.prototype.eliminateSpace function()
//{
// return this.replace(/\s*/g,);
//}//功能删除字符串中的所有半角和全角空格
//记录20230805创建
String.prototype.eliminateBlank function()
{return this.replace(/ \t/g,);
}//功能删除给字符串中的所有半角和全角空格
//输入p字符串
//输出删除所有半角和全角空格后的字符串
//记录20230805创建
function delBlankText(p)
{//return p.eliminateSpace();return p.eliminateBlank();
}//delBlankText//功能删除字符串中的nbsp;
//记录20230805创建
String.prototype.eliminateNbsp function()
{return this.replace(/nbsp;/ig,);
}//功能删除HTML字符串中的nbsp;
//输入p字符串
//输出删除所有nbsp;后的HTML字符串
//记录20230804创建
function delBlankHTML(p)
{//alert(p);return p.eliminateNbsp();
}//delBlankTextfunction showSrc()
{if (btnShowSrc.value显示源码){edRichBody.innerText edRichBody.innerHTML;btnShowSrc.value 显示预览;btnShowSrc.style.background cyan;}else{edRichBody.innerHTML edRichBody.innerText;btnShowSrc.value 显示源码;btnShowSrc.style.background yellow;}
}
/script
/body
/html
代码运行的效果如下 四、美中不足待改进的地方
我们现在可以一键删除所有的半角和全角空格以及制表符了但原有的一些排版格式如字体大小、对齐方式也同时被删除了能否在删除空格的同时保存原有排版格式呢
