您现在的位置是:网站首页> 编程资料编程资料
JavaScript 字符串新增方法 trim() 的使用说明_javascript技巧_
2023-05-24
379人已围观
简介 JavaScript 字符串新增方法 trim() 的使用说明_javascript技巧_
文章导读:
这篇文章给大家讲解在 ES5 中字符串新增方法之一:trim(),这个方法用于对空白字符的处理,这篇文章带给大家这个方法的用法以及其使用用途。
一:trim() 方法的用法
使用格式: str.trim()
使用说明: 只能去除某字符串头和尾的空格,字符串中间夹杂的空格无法去除。并且其返回的是一个新的字符串,要定义一个变量去接收新字符串。
可以看到使用 trim 方法后字符串原先前后的空格被清除掉了,长度也输出了字符本身的长度

二:trim() 实际开发中的使用
我们在提交表单时如果输入框内没有内容,会禁止提交,但是有个问题是如果我输入几个空格,就可以正常提交了,这显然是不符合我们的要求的,但是有了 trim() 方法,就可以完美解决这个 bug。
2.1 实战应用
p>此处我们来一个实际开发中的小应用来看看 trim() 方法学会了没有,此处我会写两部分代码:分别为没有使用 trim 的表单提交,以及使用了 trim 的表单提交,如果表单内容没问题则会将输入内容打印在下方,不符合要求则会弹出弹窗
2.1.1 未使用 trim 的表单提交
我们发现不输入内容的话就有正常的错误弹窗

但是只输入空格的话我们发现符合了要求而且没有错误弹窗,这不符合我们的目的

2.1.2 使用 trim 的表单提交
解决上述问题只需要加一行代码即可:var str=ipt.value.trim(),这行代码拿到表单值并对其清除了前后空格,后续执行判断时拿到的值是没有前后空格的,也就意味着如果输入空白字符则会将处理为没有输入内容,从而解决了输入空格提交表单没有弹窗的情况
顺利解决问题

到此这篇关于JavaScript 字符串新增方法 trim() 的使用说明的文章就介绍到这了,更多相关JS trim内容请搜索以前的文章或继续浏览下面的相关文章希望大家以后多多支持!
相关内容
- vue中百度地图定位及附近搜索功能使用步骤_vue.js_
- JS前端同源策略和跨域及防抖节流详解_JavaScript_
- vuex中getters的基本用法解读_vue.js_
- JavaScript 对象新增方法defineProperty与keys的使用说明_javascript技巧_
- 在nodejs中使用swagger方式_node.js_
- 简单谈一谈Vue中render函数_vue.js_
- Vue实现递归组件的思路与示例代码_vue.js_
- 不能通过IP地址访问VUE项目的问题及解决_vue.js_
- Node.js 应用探索文件解压缩示例详解_node.js_
- Javascript实用方法之json合并的场景分析_javascript技巧_
