javascript_正则表达式_\b用法详解

最新推荐文章于 2025-08-06 20:20:51 发布

最新推荐文章于 2025-08-06 20:20:51 发布 · 1k 阅读

文章标签：

#正则表达式 #JavaScript #ViewUI

javascript 专栏收录该内容

11 篇文章

订阅专栏

本文通过一个简单的HTML页面展示了JavaScript中正则表达式的边界匹配()功能。页面上有四个按钮，分别用于演示左侧边界、右侧边界、完全匹配边界及无边界匹配的效果。通过对字符串“winawinawinwindowaswin”进行不同类型的替换操作，直观地说明了边界匹配的作用。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<HEAD>  
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<TITLE>javascript(\b)test</TITLE>  
     
</HEAD>  
  
<BODY >  
    "\b"匹配一个边界，它包括字与空格之间的位置，以及目标字符串开始和结束位置等。  
    <br>  
    String str="winawin a win window aswin"  
    <ul>      
　　<li id="test_id1" onclick="leftB()" >leftB效果.</li>      
　　<li id="test_id2" onclick="rightB()">rightB效果.</li>      
　　<li id="test_id3" onclick="allB()">allB效果.</li>      
　　<li id="test_id4" onclick="noB()">noB效果.</li>      
　　</ul>
<script language="JavaScript" type="text/javascript">      
　　var str = "winawin a win window aswin"    
　　function leftB()     
　　{
　　　document.getElementById("test_id1").innerHTML=str.replace(/\bwin/g,"lose");     
　　}       
　　function rightB()     
　　{      
      document.getElementById("test_id2").innerHTML=str.replace(/win\b/g,"lose");   
　　}        
　　function allB()     
　　{      
　　　document.getElementById("test_id3").innerHTML=str.replace(/\bwin\b/g,"lose");      
　　}      
　　function noB()     
　　{      
　　　document.getElementById("test_id4").innerHTML=str.replace(/win/g,"lose");      
　　}     
　　</script>      
</BODY>  
</HTML>