- \d，\w,\s,[a-zA-Z0-9],\b,.,*,+,?,x{3},^$分別是什么?
| 字符 | 含義 |
|---|---|
| \d | 任何ASCII數(shù)字，等價于[0-9] |
| \w | 任何ASCII字符組成的單詞，等價于[a-zA-Z0-9] |
| \s | 任何Unicode空白符(空格、tab、換行、回車) |
| [a-zA-Z0-9] | a-z的所有字母,A-Z的所有字母,0-9的所有數(shù)字，等價于\w |
| \b | 匹配一個單詞的邊界，位于字符\w和\W之間的位置，或位于字符\w和字符串的開頭或者結尾之間的位置([\b]匹配的是退格符) |
| . | 除換行符\n和回車\r之外的任意字符 |
| * | 匹配前一項0次或多次，等價于[0,],/*a/也可匹配"bbb",因為字符串中含有0個a |
| + | 匹配前一項1次或多次，等價于[1,] |
| ？ | 匹配前一項-次或1此，等價于{0,1}，前一項就是可選的 |
| x{3} | 匹配x 3次 |
| ^ | 匹配以xxx開頭 |
| $ | 匹配以xxx結尾 |
貪婪模式和非貪婪模式指什么?
-
貪婪模式：
{n,m},{n, },{n},?,+,*這些匹配重復字符都是盡可能多的匹配， 在匹配滿足n的情況下會繼續(xù)匹配m-n直到m的情況，稱為貪婪模式
貪婪模式 -
非貪婪模式：非貪婪模式只需在待匹配字符后加一個
?，這樣正則表達式會盡量少的匹配，在匹配不成功時再繼續(xù)嘗試。
非貪婪模式 寫一個函數(shù)trim(str)，去除字符串兩邊的空白字符
function trim(str) {
return str.replace(/^\s+|\s+$/g,"");
}
- 使用實現(xiàn) addClass(el, cls)、hasClass(el, cls)、removeClass(el,cls)，使用正則//提示: el為dom元素，cls為操作的class， el.className獲取el元素的class
<style>
div.class1 {
color: red;
}
div.textclass {
color: yellow;
}
div.class2 {
font-size: 32px;
}
</style>
<div id="reg" class="class1 class2">
<span>正則表達式</span>
</div>
<script>
var el = document.getElementById("reg");
function hasClass(el, cls) {
var reg = new RegExp("\\b" + cls + "\\b");
if (el.className.search(reg) === -1) {
return false;
}
else {
return true;
}
}
function addClass(el, cls) {
if (!hasClass(el, cls)) {
el.className += " " + cls;
console.log(cls);
}
else {
console.log(cls + "已經存在");
}
}
function removeClass(el, cls) {
var reg = new RegExp("\\b" + cls + "\\b");
if (hasClass(el,cls)) {
el.className = el.className.replace(reg, "");
console.log(cls + "已刪除");
}
else {
console.log(cls + "未找到");
}
}
</script>
糾正
參考
- 寫一個函數(shù)isEmail(str)，判斷用戶輸入的是不是郵箱
function isEmail(str) {
var reg = /^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+\.[a-zA-z]+$/;
return reg.test(str);
}
var email = "sfyr111@163.com";
console.log("郵箱為" + isEmail(email));
- 寫一個函數(shù)isPhoneNum(str)，判斷用戶輸入的是不是手機號
function isPhoneNum(str) {
var reg = /^1{1}[3875]{1}\d{9}$/;
return reg.test(str);
}
var phoneNum = 13401637929;
console.log("手機號" + isPhoneNum(phoneNum));
- 寫一個函數(shù)isValidUsername(str)，判斷用戶輸入的是不是合法的用戶名（長度6-20個字符，只能包括字母、數(shù)字、下劃線）
function isValidUsername(str) {
var reg = /^[a-zA-Z0-9_]{6,20}/;
if (reg.test(str)) {
console.log(str + " 用戶名合法");
} else {
console.log(str + " 非法用戶名");
}
}
- 寫一個函數(shù)isValidPassword(str), 判斷用戶輸入的是不是合法密碼（長度6-20個字符，包括大寫字母、小寫字母、數(shù)字、下劃線至少兩種）
function isValidPassword(str) {
var reg = /^[0-9]+$|^[a-z]+$|^[A-Z]+$|^_+$/;
if(str.length < 6 || str.length > 20) {
console.log("密碼錯誤 密碼長度為6-20位");
return false;
}
if(reg.test(str) || /\W/.test(str)) {
console.log("密碼錯誤 密碼至少包含數(shù)字、字母大小寫、下劃線兩種");
return false;
}
console.log("密碼正確 登錄中");
return true;
}
isValidPassword("uuu4");
isValidPassword("uuuuuuu");
isValidPassword("uuuuuu443");
- 寫一個正則表達式，得到如下字符串里所有的顏色（#121212）
var re = /*正則...*/
var subj = "color: #121212; background-color: #AA00ef; width: 12px; bad-colors: f#fddee #fd2 "
alert( subj.match(re) ) // #121212,#AA00ef
var subj = "color: #121212; background-color: #AA00ef; width: 12px; bad-colors: f#fddee #fd2 "
function getColor(str) {
var re = /#[0-9a-fA-F]{6}/g;
console.log("顏色為" + str.match(re));
return str.match(re);
}
getColor(subj);
- 下面代碼輸出什么? 為什么? 改寫代碼，讓其輸出hunger, world.
var str = 'hello "hunger" , hello "world"';
var pat = /".*"/g;
str.match(pat); //"hunger" , hello "world"
//因為".*"為一個貪婪模式，在匹配`"`后匹配`.`到字符串最后一位，然后回溯找到world后面的`"`，并把這一段字符串全部取出。
var str = 'hello "hunger" , hello "world"';
var pat = /".*?"/g;
str.match(pat); //"hunger", "world"
//加上?后為非貪婪模式等價于{0,1}，在匹配到`"`后對`.*`每次只匹配0到1次如果滿足就匹配后面的`"`，直到查詢到"hunger"中`r`后，檢查后一位是否為`"`，發(fā)現(xiàn)滿足條件就取出字符串，然后對字符串繼續(xù)進行正則的匹配
- 補全如下正則表達式，輸出字符串中的注釋內容. (可嘗試使用貪婪模式和非貪婪模式兩種方法)
str = '.. <!-- My -- comment \n test --> .. <!----> .. '
re1 = /<!--[^>]*-->/g;
re2 = /<!--[\w\W]*?-->/g;
str.match(re1)
str.match(re2) // '<!-- My -- comment \n test -->', '<!---->'
- 補全如下正則表達式
var re1 = /<[^>]+?>/g;
var re2 = /<[^>]+>/g;
var str = '<> <a href="/"> <input type="radio" checked> <b>'
str.match(re1) // '<a href="/">', '<input type="radio" checked>', '<b>'
str.match(re2)
本博客版權歸 本人和饑人谷所有，轉載需說明來源
