如何用JavaScript分割字符串为数组？及现有代码获取指定元素的方法

咱们一个一个来解决你的问题哈：

最常用的方法就是用字符串自带的split()函数啦，它能根据你指定的分隔符把字符串拆分成数组元素。举几个常见场景：

• 如果你的字符串是用逗号直接分隔的（比如"1.png,2.png,3.png"），直接调用str.split(',')就能得到["1.png", "2.png", "3.png"]；
• 如果字符串里还带引号或者多余空格（就像你第二个问题里的格式），分割后还需要清理一下：先用split(',')拆分，再用map()遍历数组，把每个元素的引号和空格去掉，比如：

  const str = "'1.png','2.png','3.png'";
  const arr = str.split(',').map(item => item.trim().replace(/['"]/g, ''));
  // 结果就是 ["1.png", "2.png", "3.png"]
  

你的现有代码问题在于，var image = [image_pack_val][0]只是把整个长字符串塞进了一个数组，再取第一个元素，本质还是原来的字符串，没有真正拆分。咱们修改一下代码就能实现需求：

function xx_fn() { 
  var image_pack_val = document.getElementById("image_pack").value; 
  // 第一步：去掉字符串首尾的引号，再按逗号分割成数组
  var imageArray = image_pack_val.replace(/^['"]|['"]$/g, '').split(',');
  // 第二步：清理每个元素的单引号和多余空格
  imageArray = imageArray.map(item => item.trim().replace(/['"]/g, ''));
  // 第三步：获取第一个元素
  var firstImage = imageArray[0];
  alert(firstImage); // 点击按钮就会弹出1.png啦
}

简单解释下：原input的value是带单引号包裹的逗号分隔字符串，我们先把首尾的引号去掉，按逗号拆分成数组，再把每个元素里的单引号和空格清理干净，最后取数组索引为0的元素就是你要的1.png了。

内容的提问来源于stack exchange，提问作者reswe teryuio