如何在 TEXT 中使用 SPACES 解析 LINKS?

How to parse LINKS with SPACES in TEXT?

提问人:skywind 提问时间:3/9/2023 最后编辑:Álvaro Gonzálezskywind 更新时间:3/13/2023 访问量:110

问:

我需要解析带有 textarea 链接的文本,并通过换行符和空格将其拆分。 但是,如果指向文件的链接在文件名中包含空格,则会出现问题。

http://example.com/file (1).jpg

textarea 中的链接可以采用换行符:

http://ex.com/link1.jpg

http://ex.com/link2.jpg

或有 1 个空格

http://ex.com/link1.jpg http://ex.com/link2.jpg http://ex.com/link2.jpg

或换行符和空格的组合

我的代码:

var linksArr = [];
var text = $("textarea[name=fileslist]").val();
if (text != undefined) {
   text = text.trim(); // remove spaces from start and end of text
   if (text != '') {
      text = text.split("\n"); // split by NEW LINE
      if (Array.isArray(text) && text.length) {
         for (var a = 0; a < text.length; a++) {
            var tLine = text[a].trim(); // trim again
            if (tLine != '') {
               tLine = tLine.replace(/\s+/g, '\n'); // replace spaces by New Line
               var listLines= tLine.split("\n"); // and splin by New Line Again
               if (Array.isArray(listLines) && listLines.length) {
                  // PROBLEM IS HERE
                  // push to array
               }
            }
         }
      }
   }
}
console.log(linksArr);

我也尝试这样做,但是替换同一行链接之间的空格存在问题(encodeURI(text)http://ex.com/link1.jpg http://ex.com/link2.jpg)

您能提供最佳解决方案吗?

javascript jquery 解析 url 拆分

评论


答:

1赞 Lajos Arpad 3/13/2023 #1

您可以按空格和生成的数组拆分为将链接收集到以下位置的数组:concat

function parse() {
    var linksArr = [];
    for (let element of document.querySelectorAll("textarea[name=fileslist]")) {
        let newArray = element.value.split(/\s/).filter(item => item);
        let newItem = "";
        for (let item of newArray) {
            if (newItem === "") {
                newItem = item;
            } else if (item.indexOf("://") < 0) {
                newItem += item;
            } else {
                linksArr.push(newItem);
                newItem = item;
            }
        }
        if (newItem) linksArr.push(newItem);
    }
    console.log(linksArr);
}
<textarea name="fileslist">http://a.b.c  http://d.e.f</textarea>
<textarea name="fileslist">http://g.h.i
http://j.k.l</textarea>
<textarea name="fileslist">http://m.n.o (1) http://p.q.r (2)</textarea>

<input type="button" value="Parse" onclick="parse()">

解释:

  • 我提供了三个具有指定名称的文本区域,以提供两个不同的示例
  • 我正在循环播放它们
  • 对于每个文本区域
    • 我用空格分割它
    • 筛选结果以删除空项
    • 循环过滤后的数组
      • 如果我们还没有当前链接,则我们将项目设置为当前链接
      • 否则,如果我们的子字符串中没有,那么我们就会附加当前链接://
      • 否则,我们将刚刚结束的链接推送到,并将当前块设置为当前链接linkArr
    • 当循环完成时,如果我们还没有这样做,我们会推送任何剩余的链接

评论

0赞 skywind 3/13/2023
但是链接的问题 - 它会被错误地拆分:example.com/file,(1).jpghttp://example.com/file (1).jpg
1赞 Lajos Arpad 3/13/2023
好的,但是你希望它如何工作?您是否打算在新元素包含之前连接元素?://
0赞 skywind 3/13/2023
是的,最好检查零件是否有 :// 并连接它
1赞 Lajos Arpad 3/13/2023
@skywind相应地编辑了我的代码,我正在编辑解释......