国产视频app在web的前端操作中,有時候需要將 html 的 textarea 標簽元素中的內容以每行的形式轉成一個數組并發向后臺,那么該如何做呢?下面這篇博文就來說一說,通過利用 js 將 textarea 標簽元素中的內容以換行或回車進行分割并轉成數組的方法。

js將 textarea 標簽內容轉成數組的方法

textarea 中的內容轉成數組一般都是以每行內容做為一個元素,而 textarea 元素中的內容都是以 '\r\n' 或 '\n' 進行換行的。我們只要使用 js 中的 split() 方法通過'\r\n' 或 '\n' 字符對內容進行分割即可。

JS代碼如下:

<script>
var textarea = document.getElementById("test_textarea");
var str = textarea.value;
str_array = new Array();
//分割方法1
str_array = str.split(/[(\r\n)\r\n]+/);
//分割方法2
//str_array = str.split("\n");
console.log(str_array);
</script>

注意:

1、上面提供了兩個分割方法,其結果也是不同的

2、方法1的分割會去掉一行空白行

3、方法2的分割會保留空白行并將轉成數組元素

js去掉數組中的空值的元素

js 將 textarea 元素中的內容轉成數組時,可能會產生空值的數組元素,為了不影響數據的準確性,我們需要將數組中值為空的元素移除掉。

代碼如果:

<script>
for (i = 0; i < str_array.length; i++) {
    if (str_array[i] === "") {
        str_array.splice(i, 1);//去掉值為空的數組
        i = i - 1; //刪除空之后,后面的元素要向前補位
    }
}
</script>

JS 將 textarea 標簽中的內容通過回車或換行轉成數組的完整教程

国产视频app你可以將下面的html代碼保存到本地,進行測試

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <textarea id="test_textarea" cols="30" rows="10"></textarea>
    <button onclick="ec()">點擊運行</button>
</head>
<body>
    <script>
        function ec(){
            var textarea = document.getElementById("test_textarea");
            var str = textarea.value;
            var str_array = new Array();
         // str_array = str.split(/[(\r\n)\r\n]+/); //方法1
            str_array = str.split("\n"); //方法2
            console.log(str_array);
            for (i = 0; i < str_array.length; i++) {
                if (str_array[i] === "") {
                    str_array.splice(i, 1);//去掉值為空的數組
                    i = i - 1;
                }
            }
            console.log(str_array);
        }
    </script>
</body>
</html>