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 相关文章推荐
Jquery中增加参数与Json转换代码
Nov 20 Javascript
jquery禁用右键示例
Apr 28 Javascript
jQuery新的事件绑定机制on()示例应用
Jul 18 Javascript
jQuery中extend函数详解
Jul 13 Javascript
JavaScript如何动态创建table表格
Aug 02 Javascript
基于Bootstrap使用jQuery实现简单可编辑表格
May 04 Javascript
详解angular2实现ng2-router 路由和嵌套路由
Mar 24 Javascript
vue中动态设置meta标签和title标签的方法
Jul 11 Javascript
详解js中Array的方法及技巧
Sep 12 Javascript
vue 解决遍历对象显示的顺序不对问题
Nov 07 Javascript
Vue中函数防抖节流的理解及应用实现
Apr 24 Javascript
jQuery加PHP实现图片上传并提交的示例代码
Jul 16 jQuery
原生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
使用php4加速网络传输
2006/10/09 PHP
目录,文件操作详谈―PHP
2006/11/25 PHP
PHP数组内存耗用太多问题的解决方法
2010/04/05 PHP
通过curl模拟post和get方式提交的表单类
2014/04/23 PHP
thinkphp实现like模糊查询实例
2014/10/29 PHP
php使用pdo连接mssql server数据库实例
2014/12/25 PHP
初识ThinkPHP控制器
2016/04/07 PHP
PHPTree――php快速生成无限级分类
2018/03/30 PHP
PHP基于rabbitmq操作类的生产者和消费者功能示例
2018/06/16 PHP
thinkphp3.2同时连接两个数据库的简单方法
2019/08/13 PHP
php给数组赋值的实例方法
2019/09/26 PHP
laravel框架中间件简单使用方法示例
2020/01/25 PHP
jQuery 动画基础教程
2008/12/25 Javascript
JavaScript CSS修改学习第五章 给“上传”添加样式
2010/02/19 Javascript
javascript trim函数在IE下不能用的解决方法
2014/09/12 Javascript
基于jquery实现下拉框美化特效
2016/02/02 Javascript
微信小程序 swiper组件详解及实例代码
2016/10/25 Javascript
Express与NodeJs创建服务器的两种方法
2017/02/06 NodeJs
详解前端路由实现与react-router使用姿势
2017/08/07 Javascript
Angular数据绑定机制原理
2018/04/17 Javascript
JavaScript 双向链表操作实例分析【创建、增加、查找、删除等】
2020/04/28 Javascript
浅谈React中组件逻辑复用的那些事儿
2020/05/21 Javascript
vue实现图片按比例缩放问题操作
2020/08/11 Javascript
vue 动态给每个页面添加title、关键词和描述的方法
2020/08/28 Javascript
[00:58]PWL开团时刻DAY5——十人开雾0换5
2020/11/04 DOTA
对python opencv 添加文字 cv2.putText 的各参数介绍
2018/12/05 Python
css3实现小箭头各种图形效果
2020/07/08 HTML / CSS
沪江旗下的海量优质课程平台:沪江网校
2017/11/07 全球购物
应届生简历中的自我评价
2014/01/13 职场文书
电信营业员自我评价分享
2014/01/17 职场文书
小学开学寄语
2014/01/19 职场文书
竞选班长自荐书范文
2014/03/09 职场文书
2015年销售员工作总结范文
2015/04/07 职场文书
2015年测量员工作总结
2015/05/23 职场文书
2016特色励志班级口号
2015/12/24 职场文书
django学习之ajax post传参的2种格式实例
2021/05/14 Python