如何解析文本中带有空格的链接？

huangapple
go评论93阅读模式
英文:

How to parse LINKS with SPACES in TEXT?

问题

我需要解析文本中的链接并按换行和空格分割。但如果文件名中包含空格，则会出现问题。

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

文本区域中的链接可能是在新行中：

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

或者带有一个空格：

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

或者是新行和空格的组合。

我的代码：

  1. var linksArr = [];
  2. var text = $("textarea[name=fileslist]").val();
  3. if (text != undefined) {
  4.    text = text.trim(); // 去除文本开头和结尾的空格
  5.    if (text != '') {
  6.       text = text.split("\n"); // 按照换行符分割
  7.       if (Array.isArray(text) && text.length) {
  8.          for (var a = 0; a < text.length; a++) {
  9.             var tLine = text[a].trim(); // 再次去除空格
  10.             if (tLine != '') {
  11.                tLine = tLine.replace(/\s+/g, '\n'); // 用换行符替换空格
  12.                var listLines= tLine.split("\n"); // 再次按照换行符分割
  13.                if (Array.isArray(listLines) && listLines.length) {
  14.                   // 问题在这里
  15.                   // 加入数组
  16.                }
  17.             }
  18.          }
  19.       }
  20.    }
  21. }
  22. console.log(linksArr);

我还尝试使用encodeURI(text)，但是在同一行的链接之间替换空格时会出现问题（http://ex.com/link1.jpg http://ex.com/link2.jpg）。

你能帮助找到一个更优化的解决方案吗？

英文:

I need to parse text with links from textarea and split It by NewLines and Spaces.
But there is a problem if the link to the file contains spaces in the file name.

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

Links in textarea may be in newlines:

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

or with 1 space

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

or combinations of newlines and spaces

My Code:

  1. var linksArr = [];
  2. var text = $(&quot;textarea[name=fileslist]&quot;).val();
  3. if (text != undefined) {
  4.    text = text.trim(); // remove spaces from start and end of text
  5.    if (text != &#39;&#39;) {
  6.       text = text.split(&quot;\n&quot;); // split by NEW LINE
  7.       if (Array.isArray(text) &amp;&amp; text.length) {
  8.          for (var a = 0; a &lt; text.length; a++) {
  9.             var tLine = text[a].trim(); // trim again
  10.             if (tLine != &#39;&#39;) {
  11.                tLine = tLine.replace(/\s+/g, &#39;\n&#39;); // replace spaces by New Line
  12.                var listLines= tLine.split(&quot;\n&quot;); // and splin by New Line Again
  13.                if (Array.isArray(listLines) &amp;&amp; listLines.length) {
  14.                   // PROBLEM IS HERE
  15.                   // push to array
  16.                }
  17.             }
  18.          }
  19.       }
  20.    }
  21. }
  22. console.log(linksArr);

Also I try to encodeURI(text) but then there is a problem with replacing spaces between links on the same line (http://ex.com/link1.jpg http://ex.com/link2.jpg)

Can you help with optimal solution?

答案1

得分: 1

你可以通过空格分隔，然后将得到的数组连接到收集链接的数组中：

  1. function parse() {
  2.     var linksArr = [];
  3.     for (let element of document.querySelectorAll("textarea[name=fileslist]")) {
  4.         let newArray = element.value.split(/\s/).filter(item => item);
  5.         let newItem = "";
  6.         for (let item of newArray) {
  7.             if (newItem === "") {
  8.                 newItem = item;
  9.             } else if (item.indexOf("://") < 0) {
  10.                 newItem += item;
  11.             } else {
  12.                 linksArr.push(newItem);
  13.                 newItem = item;
  14.             }
  15.         }
  16.         if (newItem) linksArr.push(newItem);
  17.     }
  18.     console.log(linksArr);
  19. }

解释：

  • 我提供了三个具有指定名称的文本区域，以便有两个不同的示例。
  • 我对它们进行循环。
  • 对于每个文本区域
    • 我将其按空格分隔。
    • 过滤结果以删除空项。
    • 循环过滤后的数组
      • 如果我们还没有当前链接，那么我们将项目设置为我们的当前链接。
      • 否则，如果我们的子字符串中没有 ://，那么我们将当前链接附加上去。
      • 否则，我们将刚刚结束的链接推送到 linkArr，并将当前块设置为我们的当前链接。
    • 当循环完成时，如果我们尚未这样做，我们将推送任何剩余的链接。
英文:

You can split by whitespaces and concat the resulting array into the array where you collect your links into:

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

  1. function parse() {
  2.     var linksArr = [];
  3.     for (let element of document.querySelectorAll(&quot;textarea[name=fileslist]&quot;)) {
  4.         let newArray = element.value.split(/\s/).filter(item =&gt; item);
  5.         let newItem = &quot;&quot;;
  6.         for (let item of newArray) {
  7.             if (newItem === &quot;&quot;) {
  8.                 newItem = item;
  9.             } else if (item.indexOf(&quot;://&quot;) &lt; 0) {
  10.                 newItem += item;
  11.             } else {
  12.                 linksArr.push(newItem);
  13.                 newItem = item;
  14.             }
  15.         }
  16.         if (newItem) linksArr.push(newItem);
  17.     }
  18.     console.log(linksArr);
  19. }

<!-- language: lang-html -->

  1. &lt;textarea name=&quot;fileslist&quot;&gt;http://a.b.c  http://d.e.f&lt;/textarea&gt;
  2. &lt;textarea name=&quot;fileslist&quot;&gt;http://g.h.i
  3. http://j.k.l</textarea>
  4. &lt;textarea name=&quot;fileslist&quot;&gt;http://m.n.o (1) http://p.q.r (2)&lt;/textarea&gt;
  6. &lt;input type=&quot;button&quot; value=&quot;Parse&quot; onclick=&quot;parse()&quot;&gt;

<!-- end snippet -->

Explanation:

  • I have provided three textareas with the specified name to have two distinct examples
  • I'm looping them
  • for each textarea
    • I split it by whitespaces
    • filter the result to remove empty items
    • looping the filtered array
      • if we do not have a current link yet, then we set the item to our current link
      • else if we do not have :// in our substring, then we append our current link
      • else we push the just ended link to linkArr and set our current chunk as our current link
    • when the loop completes, we push any remaining link if we did not do so already

huangapple
  • 本文由 发表于 2023年3月9日 19:40:54
  • 转载请务必保留本文链接：https://go.coder-hub.com/75684109.html
  • javascript
  • jquery
  • parsing
  • split
  • url
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定