首頁 > web前端 > 前端問答 > javascript有split函數嗎

javascript有split函數嗎

青灯夜游
發布: 2023-01-07 11:42:04
原創
2721 人瀏覽過

javascript中split函數。 split()是js String物件的內建函數,用於將字串分隔為字串數組,並傳回該字串數組,語法格式「str.split(分隔符號 [,length])」。

javascript有split函數嗎

本教學操作環境:windows7系統、javascript1.8.5版、Dell G3電腦。

JavaScript String物件split()

#JavaScript split() 方法用來將字串分隔為字串數組,格式為:

str.split( 分隔符 [,length] )
登入後複製

此方法和陣列的join() 互為逆運算。

split() 方法根據「分隔符號」參數將字串分隔成不大於「length」參數指定長度的字串陣列。參數「分隔符號」既可以是某個字串,也可以是一個正規表示式。參數「length」可選,此參數可指定傳回的陣列的最大長度。如果設定了 length 參數,則傳回的字串個數不會多於這個參數;如果沒有設定該參數,整個字串都會被分割,不考慮其長度。

split() 方法在分隔符號指定的邊界處將字串 str 分隔,傳回的陣列中的字串不包括分隔符號本身。需要注意的是,如果分隔符號為空字串'',則 str 字串中的每個字元之間都會被分割。

split() 範例如下:

var str = "Hello,can I help you?";
alert(str.split(","));//使用,作为分隔符,输出:["Hello","can I help you?"]
alert(str.split(' '));//使用空格字符串作为分隔符,输出:["Hello,can", "I", "help", "you?"]
alert(str.split(''));//使用空字符串作为分隔符,输出:["H","e","l","l","o",",","c","a","n","
                       //","I"," ","h","e","l","p"," ","y","o","u","?"]
alert(str.split('can'));//使用"can"字符串作为分隔符,输出:["Hello,", " I help you?"]
登入後複製

實例:使用 split() 實作對輸入文字設定背景顏色。

<!doctype html>
<html>
<head>
<meta charset = "utf-8">
<title>使用split()和join()实现对输入文字设置背景颜色</title>
<script>
     window.onload = function(){
         var oDiv = document.getElementById(&#39;div1&#39;);
         var aInp = document.getElementsByTagName(&#39;input&#39;);
         var arrColor = [&#39;#FFC&#39;,&#39;#CC3&#39;,&#39;#6FC&#39;,&#39;#9C9&#39;,&#39;#C6F&#39;,&#39;#CFF&#39;];
        
         aInp[1].onclick = function(){
            var str = aInp[0].value;
            var arr = str.split(&#39;&#39;);//将字符串使用空字符串分隔为字符串数组
         
            for(var i = 0; i < arr.length; i++){
               arr[i] = &#39;<span style="background:&#39;+arrColor[i%arrColor.length]+&#39;;">&#39;+
                      arr[i]+&#39;</span>&#39;;
            }
            oDiv.innerHTML = arr.join(&#39;&#39;);//将数组各个元素使用空字符串连接成字符串
            aInp[0].value = &#39;&#39;;//清空文本框中输入的文本内容
         };
     };
</script>
<body>
   <div id="div1" style="width:300px;height:50px;"></div>
     <input type="text"/>
   <input type="button" value="提交"/>
</body>
</html>
登入後複製

上述JS 程式碼使用split('') 以空字元將字串分隔到的一個字元作為陣列元素存放在陣列arr 中,然後使用循環語句對陣列中的每個字元元素添加背景顏色後,透過join('') 使用空字元將陣列中的各個字元元素連接成一個字串。

運行結果:

在文字方塊中輸入文字內容:

javascript有split函數嗎

#點擊提交按鈕後為文字新增背景:

javascript有split函數嗎

【相關推薦:javascript學習教學

以上是javascript有split函數嗎的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板