javascript实现英文首字母大写


Posted in Javascript onApril 23, 2015

方法一:

function replaceStr(str){ // 正则法
 str = str.toLowerCase();
 var reg = /\b(\w)|\s(\w)/g; //  \b判断边界\s判断空格
 return str.replace(reg,function(m){ 
  return m.toUpperCase()
 });
}

function replaceStr1(str){
 str = str.toLowerCase();
 var strTemp = ""; //新字符串
 for(var i=0;i<str.length;i++){
  if(i == 0){
   strTemp += str[i].toUpperCase(); //第一个
   continue;
  }
  if(str[i] == " " && i< str.length-1){ //空格后
   strTemp += " ";
   strTemp += str[i+1].toUpperCase();
   i++;
   continue;
  }
  strTemp += str[i];
 }
  return strTemp;
 }
 

var text = "abcd ABCD efGH";
console.log(replaceStr(text));//Abcd Abcd Efgh
console.log(replaceStr1(text));//Abcd Abcd Efgh

方法二:

<script type="text\javascript">
function ucfirst(str){
var str = str.toLowerCase();
var strarr = str.split(' ');
var result = '';
for(var i in strarr){
result += strarr[i].substring(0,1).toUpperCase()+strarr[i].substring(1)+' ';
}
return result;
}
</script>

 方法三:

<script type="text\javascript">
function ucfirst(str) {
var str = str.toLowerCase();
str = str.replace(/\b\w+\b/g, function(word){
  return word.substring(0,1).toUpperCase()+word.substring(1);
});
return str; 
</script>

CSS来实现:

<html>
 <head>
 <style type="text/css"> 
  h1 {text-transform: uppercase} 
  p.uppercase {text-transform: uppercase}   
  p.lowercase {text-transform: lowercase}  
  p.capitalize {text-transform: capitalize } 
 </style>
 </head>
 <body>
  <h1>This Is An H1 Element</h1>
   <p class="uppercase">This is a test.</p><p class="lowercase">This is a test.</p><p class="capitalize">This is a test.</p>
 </body>
</html>

以上就是给大家总结的4种实现英文首字母大写的方法,希望大家能够喜欢。

Javascript 相关文章推荐
javascript之对系统的toFixed()方法的修正
May 08 Javascript
纯js实现div内图片自适应大小(已测试,兼容火狐)
Jun 16 Javascript
javascript鼠标滑动评分控件完整实例
May 13 Javascript
javascript简单判断输入内容是否合法的方法
May 11 Javascript
前端框架Vue.js中Directive知识详解
Sep 12 Javascript
自己封装的一个原生JS拖动方法(推荐)
Nov 22 Javascript
jQuery zTree搜索-关键字查询 递归无限层功能实现代码
Jan 25 jQuery
微信小程序非跳转式组件授权登录的方法示例
May 22 Javascript
Vue响应式原理Observer、Dep、Watcher理解
Jun 06 Javascript
vue中的过滤器实例代码详解
Jun 06 Javascript
jquery.pager.js分页实现详解
Jul 29 jQuery
原生JS实现拖拽功能
Dec 16 Javascript
原生js和jquery实现图片轮播淡入淡出效果
Apr 23 #Javascript
浅谈javascript中for in 和 for each in的区别
Apr 23 #Javascript
原生js和jquery实现图片轮播特效
Apr 23 #Javascript
使用纯javascript实现经典扫雷游戏
Apr 23 #Javascript
jQuery图片特效插件Revealing实现拉伸放大
Apr 22 #Javascript
jQuery插件jcrop+Fileapi完美实现图片上传+裁剪+预览的代码分享
Apr 22 #Javascript
javascript解三阶幻方(九宫格)
Apr 22 #Javascript
You might like
这部好评如潮的动漫 知名梗频出 但是画风劝退很多人
2020/03/08 日漫
造就帕卡马拉的帕卡斯是怎么被发现的
2021/03/03 咖啡文化
php在字符串中查找另一个字符串
2008/11/19 PHP
Yii2学习笔记之汉化yii设置表单的描述(属性标签attributeLabels)
2017/02/07 PHP
IE不出现Flash激活框的小发现的js实现方法
2007/09/07 Javascript
jquery ajax 同步异步的执行示例代码
2010/06/23 Javascript
jQuery Clone Bug解决代码
2010/12/22 Javascript
IE8中动态创建script标签onload无效的解决方法
2014/12/22 Javascript
Yii2使用Bootbox插件实现自定义弹窗
2015/04/02 Javascript
详解AngularJS中的依赖注入机制
2015/06/17 Javascript
原生JS实现仿淘宝网左侧商品分类菜单效果代码
2015/09/10 Javascript
jQuery表格行上移下移和置顶的实现方法
2015/10/08 Javascript
JavaScript数据结构与算法之栈与队列
2016/01/29 Javascript
快速掌握Node.js中setTimeout和setInterval的使用方法
2016/03/21 Javascript
jQuery插件Echarts实现的双轴图效果示例【附demo源码下载】
2017/03/04 Javascript
利用node.js爬取指定排名网站的JS引用库详解
2017/07/25 Javascript
温故知新——JavaScript中的字符串连接问题最全总结(推荐)
2017/08/21 Javascript
微信小程序template模板实例详解
2017/10/27 Javascript
Javascript防止图片拉伸的自适应处理方法
2017/12/26 Javascript
Vue.js 实现微信公众号菜单编辑器功能(一)
2018/05/08 Javascript
解决vue attr取不到属性值的问题
2018/09/18 Javascript
微信小程序webview与h5通过postMessage实现实时通讯的实现
2019/08/20 Javascript
jquery ajax 请求小技巧实例分析
2019/11/11 jQuery
html+vue.js 实现漂亮分页功能可兼容IE
2020/11/07 Javascript
Python 通过URL打开图片实例详解
2017/06/01 Python
Mac 上切换Python多版本
2017/06/17 Python
Python实现简单的HttpServer服务器示例
2017/09/25 Python
Python中生成器和迭代器的区别详解
2018/02/10 Python
Windows下PyCharm安装图文教程
2018/08/27 Python
HTML5 Canvas 绘图——使用 Canvas 绘制图形图文教程 使用html5 canvas 绘制精美的图
2015/08/31 HTML / CSS
奥地利网上现代灯具和灯饰店:Lampenwelt.at
2018/01/29 全球购物
《鸟岛》教学反思
2014/04/26 职场文书
党员反对四风问题思想汇报
2014/09/12 职场文书
银行员工考核评语
2014/12/31 职场文书
Python中requests做接口测试的方法
2021/05/30 Python
解决pycharm安装scrapy DLL load failed:找不到指定的程序的问题
2021/06/08 Python