>웹 프론트엔드 >프런트엔드 Q&A >자바스크립트에 분할 기능이 있나요?

자바스크립트에 분할 기능이 있나요?

青灯夜游
青灯夜游원래의
2021-07-06 15:57:242732검색

자바스크립트의 분할 기능. Split()은 문자열을 문자열 배열로 분리하고 문자열 배열을 반환하는 데 사용되는 js String 개체의 내장 함수입니다. 구문 형식은 "str.split(separator [,length])"입니다.

자바스크립트에 분할 기능이 있나요?

이 튜토리얼의 운영 환경: Windows 7 시스템, JavaScript 버전 1.8.5, Dell G3 컴퓨터.

JavaScript 문자열 개체 분할()

JavaScript 분할() 메서드는 문자열을 문자열 배열로 분리하는 데 사용되며 형식은 다음과 같습니다.

str.split( 分隔符 [,length] )

이 메서드와 배열의 Join()은 반대입니다. 서로의 작전.

split() 메서드는 "separator" 매개변수에 따라 문자열을 "length" 매개변수로 지정된 길이보다 길지 않은 문자열 배열로 분할합니다. 매개변수 "separator"는 문자열이거나 정규식일 수 있습니다. 선택적 "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?"]

예: 입력 텍스트의 배경색을 설정하려면 분할()을 사용하세요.

<!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 코드는 분할('')을 사용하여 문자열의 문자를 null 문자로 구분하여 arr 배열의 배열 요소로 저장한 다음 루프 문을 사용하여 arr의 각 문자 요소에 배경색을 추가합니다. Join('')은 null 문자를 사용하여 배열의 문자 요소를 문자열로 연결합니다.

실행 결과:

텍스트 상자에 텍스트 내용 입력:

자바스크립트에 분할 기능이 있나요?

제출 버튼을 클릭하여 텍스트에 배경을 추가하세요:

자바스크립트에 분할 기능이 있나요?

[관련 권장 사항: javascript 학습 튜토리얼]

위 내용은 자바스크립트에 분할 기능이 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.