运用正则+replace+substring将一段英语的字母大写 angurlar运用自定义指令filter完成首字母大写
复习下js基础并运用正则+replace+substring将一段英语的字母大写
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>首字母大写</title>
</head>
<body>
<div class="dv"></div>
</body>
</html>
<script>
var str = "this is a javascript string";
str = str.replace(/\b\w+\b/g,function(word){ //运用正则方式将语句截取成一个一个的单词
console.log(word);//打印出来截取的字符串
console.log(word.substring(0,1).toUpperCase())//将截取的首字母大写
console.log(word.substring(0,1).toUpperCase()+word.substring(1)) //将大写的字符串拼接到未大写的上面
return word.substring(0,1).toUpperCase()+word.substring(1);//将所有的字符return出去
})
document.write(str)//在页面上打印出来
</script>
配合angularjs 的自定义指令将命令输出
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Document</title>
</head>
<style>
input.ng-invalid{
background: red;
}
</style>
<body>
<div ng-app="myApp" ng-init='firstName="Jon"' ng-controller="mycrl">
<input type="text" ng-model="name" required/>
<h2>年龄:{{age}}</h2>
{{ str | toUpercase}} //输出结果
</div>
</body>
</html>
<script src="js/angurlar素材/angular/angular.js"></script>
<script>
var app =angular.module("myApp",[]);
app.controller("mycrl",function($scope){
$scope.name="";
$scope.age =18;
$scope.str= "this is my first work"
});
app.filter("toUpercase",function(){//自定义指令
return function(str){
return str.replace(/\b\w+\b/g,function(word){//replace配合正则截取每一个单词
return word.substring(0,1).toUpperCase()+word.substring(1);//运用substring截取每个单词的首字母并大写
});
}
})
</script>
这样就输出个简单的angular应用了
运用正则+replace+substring将一段英语的字母大写 angurlar运用自定义指令filter完成首字母大写的更多相关文章
- java String中的replace(oldChar,newChar) replace(CharSequence target,CharSequence replacement) replaceAll replaceFirst 面试题:输入英文语句,单词首字符大写后输出 char String int 相互转换
package com.swift; import java.util.Scanner; public class FirstChat_ToCaps_Test { public static void ...
- JS replace()方法-字符串首字母大写
replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串. replace()方法有两个参数,第一个参数是正则表达式,正则表达式如果带全局标志/g,则是代表替换 ...
- 正则replace 回调函数里接收的参数是什么?
前言 我们都知道 replace 在做替换处理方面会很常用,通常也是第一个会想到的方法.replace 第一个参数可以传入 string 或 RegExp,第二个参数可以传入 string 或 一个回 ...
- java 正则 replace 忽略大小写
String description = model.getDescription(); if (!"".equals(description)) { //replace(/\&l ...
- C#正则实现匹配一块代码段
最近项目,生成聚合网关,但是生成的网关文件中,存在着不必要的代码段,比如一个类A,类B等 之前一直使用手动删除,这么做劳民伤财,浪费时间,考虑使用正则写一个工具实现自动删除. 正则写法: string ...
- Js正则Replace方法
JS正则的创建有两种方式: new RegExp() 和 直接字面量. //使用RegExp对象创建 var regObj = new RegExp("(^\s+)|(\s+$)" ...
- JS正则 replace()方法全局替换变量(可以对变量进行全文替换)
转至:https://www.cnblogs.com/jasonlam/p/7070604.html var text = "饿~,23333.饿~,测试yongde"; var ...
- JS学习笔记 - fgm练习 - 输入数字求和 正则replace onkeyup事件
<style> body{font-size: 12px;} .outer{ width: 500px; margin: 0 auto; } span{ color: #999; } in ...
- mysql replace substring 字符串截取处理
SELECT a1,a2,replace(a2, "豫ICP备16006180号-", "") a22,a3,a4,a5 FROM `aaab` order b ...
随机推荐
- [学习笔记]Javaweb开发视频教程之Tomcat9配置
参考自北京动力节点的视频教程:https://www.bilibili.com/video/av14548279/?p=1 1.Java XE Java SE 是做电脑上运行的软件. Java EE ...
- 玩转接口测试工具fiddler 教程系列1
我们在做web测试的时候,很多时候需要查看接口发送的数据返回的数据是否正常,这样可以排除是客户端的问题还是服务器的问题,举个例子来说,如果我们发现页面上面数据少了, 通过fiddler查看数据返回就少 ...
- ThreadLocal 原理和使用场景分析
ThreadLocal 不知道大家有没有用过,但至少听说过,今天主要记录一下 ThreadLocal 的原理和使用场景. 使用场景 直接定位到 ThreadLocal 的源码,可以看到源码注释中有很清 ...
- [高级软件工程教学]团队Alpha阶段成绩汇总
一.作业地址: https://edu.cnblogs.com/campus/fzu/AdvancedSoftwareEngineering/homework/1408 https://edu.cnb ...
- 网络1712--c语言嵌套循环作业总结
1.助教有话说 首先,每周一篇的博客作业是很有必要的:编程的过程不仅仅是会敲几行代码.能够通过PTA就大吉大利了,你更应该做到的是梳理代码思路,通过与他人代码思路的比对,取其精华,进而不断进阶,才能逐 ...
- java-JProfiler(一)-安装以及简介
一.下载 下载http://www.ej-technologies.com/download/jprofiler/files 目前网上有9.2版本的使用方式,10.暂时还无法完美使用 可以下载zip包 ...
- C语言第十次作业
一.PTA实验作业 题目1:按等级统计学生成绩 1. 本题PTA提交列表 2.设计思路 int i,count =0 用来计未及格数 for i =0 to n if 指针p+i 指向的成绩score ...
- 冲刺NO.10
Alpha冲刺第十天 站立式会议 项目进展 项目核心功能逐步构建完成,测试工作也已开始.主要对部分功能组合进行测试以测试系统可用性. 问题困难 项目的主要困难在这个时间点主要存在于测试工作中,测试工作 ...
- 201621123060《JAVA程序设计》第二周学习总结
1.本周学习总结 本周学习了JAVA中的引用类.包装类(学习了一种语法:自动装箱)和数组(遍历数组的新方法foreach循环). 2. 书面作业 1.String-使用Eclipse关联jdk源代码 ...
- 团队作业7——第二次项目冲刺(Beta版本12.08-12.10)
1.当天站立式会议照片 本次会议内容:1:每个人汇报自己完成的工作.2:组长分配各自要完成的任务. 2.每个人的工作 黄进勇:项目整合,后台代码. 李勇:前台界面优化. 何忠鹏:数据库模块. 郑希彬: ...