使用jQuery将textarea中自定义HTML的intensity值按逗号分隔输出

问题原因 #

直接对多元素匹配的jQuery对象调用.text()会把所有元素的文本内容无分隔直接拼接，因此得到连续无逗号的字符串。

修复方案 #

遍历所有匹配的<intensity>节点收集数值，再用指定分隔符拼接即可，修正后代码如下：

$(document).ready(function(){
  // 匹配所有外层intensity节点下的子intensity节点
  var $intensityList = $("<div/>").html($('.textarea').val()).find("intensity intensity");
  // 遍历提取每个节点的文本，转成原生数组后用逗号+空格拼接
  var result = $intensityList.map(function(){
    return $(this).text();
  }).get().join(', ');
  console.log(result);
});
// 输出结果：64, 88, 32, 53

逻辑说明

• $intensityList拿到所有包含数值的子<intensity>节点集合
• .map()遍历每个节点，返回对应节点的文本内容
• .get()将jQuery返回的类数组对象转为标准JS数组
• .join(', ')按要求的分隔符把数组拼接为字符串

内容的提问来源于stack exchange，提问作者Sweety Dheeraj