Javascript 编码建议：dom操作-将文本拆分为动态范围 有关更新的问题，请参阅下面编辑的文章

我已经解决了一个dom操作问题，但我不相信这是解决这个问题的最干净、最清晰的方法

老问题：将innerHTML从一组元素转换为三个跨度，并用新转换的跨度替换每个元素的innerHTML

例如：

<h1>This is awesome<h1>
<h1>
  <span class="color-1">This</span>
  <span class="color-2">is</span>
  <span class="color-3">awesome</span>
</h1>

这种方法的问题是它不能重复使用超过3个部件

---

新问题：有没有一种方法可以使这个函数通用，让它根据一个参数将单词分成任意数量的部分，例如pushWordSpansToSeparateArrays（string，totalParts）

这似乎要短得多，可以根据您的需要（我认为是）进行调整：

String.prototype.splitInto3 = function () {
  const splitString = this.trim().split(" ");
  var firstThird = Math.ceil(splitString.length/3);
  var secondThird = splitString.length-Math.floor((splitString.length-firstThird)/2);
  var obResponse = {
    firstSegment: splitString.slice(0, firstThird),
    secondSegment: splitString.slice(firstThird, secondThird),
    thirdSegment: splitString.slice(secondThird, splitString.length)
  }
  return obResponse;
}
var segments = "test a b c d e f g h i j k l m n o ".splitInto3();
console.log("First third ("+segments.firstSegment.length+"): "+segments.firstSegment);
console.log("Second third ("+segments.secondSegment.length+"): "+segments.secondSegment);
console.log("Third third ("+segments.thirdSegment.length+"): "+segments.thirdSegment);

或者作为数组

String.prototype.splitInto3 = function () {
  const splitString = this.trim().split(" ");
  var firstThird = Math.ceil(splitString.length/3);
  var secondThird = splitString.length-Math.floor((splitString.length-firstThird)/2);
  var obResponse = [splitString.slice(0, firstThird), splitString.slice(firstThird, secondThird), splitString.slice(secondThird, splitString.length)]
  return obResponse;
}
var segments = "test a b c d e f g h i j k l m n o ".splitInto3();
console.log("First third ("+segments[0].length+"): "+segments[0]);
console.log("Second third ("+segments[1].length+"): "+segments[1]);
console.log("Third third ("+segments[2].length+"): "+segments[2]);

---

我现在要去睡觉了，希望它能起作用

String.prototype.splitInto = function (parts) {
  const splitString = this.trim().split(" ");
  obResponse = {};
  obResponse.values = [];
  var chunkSize = Math.floor(splitString.length/(parts));
  var spares = splitString.length%parts;
  var start = 0;
  for(var i = 0; i < parts; i++) {
    obResponse.values[i] = splitString.slice(start, start+chunkSize+(spares>i?1:0));
    start = start+chunkSize+(spares>i?1:0);
  }
  return obResponse;
}
var segments = "test a b k l m n o ".splitInto(3);
console.log(segments.values);

String.prototype.splitInto=函数（部分）{
const splitString=this.trim（）.split（“”）；
obResponse={}；
obResponse.values=[]；
var chunkSize=Math.floor（splitString.length/（parts））；
var备件=拆分字符串。长度%parts；
var start=0；
对于（变量i=0；ii？1:0））；
开始=开始+块大小+（备件>i？1:0）；
}
返回响应；
}
var segments=“测试a b k l m n o”。拆分为（3）；
console.log（段.值）；

请不要发布代码的链接，请编辑问题以包含代码的相关部分。@PatrickHund抱歉，我将代码放在了postHi Nathan谢谢你。第二个三分之一并不总是2*1/3。例如，如果长度是16，我想要6 5。你的结果给了我64分。（至少看起来是这样）我更喜欢数组而不是对象，但这是一个次要的细节，我会根据残差调整第二个第三个。我会接受这个答案。结果是现在我得到了一个用逗号分隔的字符串。这是一个数组-你需要使用

将它们连接起来。join（“”

-所以

段[0]。join（“”

例如是的，我找到了，谢谢。我编辑了我的文章，因为这种方法确实使它成为静态的（你只能在3个部分中使用它）。您知道如何使零件数量动态变化吗？这就是为什么我首先想到递归函数。

String.prototype.splitInto3 = function () {
  const splitString = this.trim().split(" ");
  var firstThird = Math.ceil(splitString.length/3);
  var secondThird = splitString.length-Math.floor((splitString.length-firstThird)/2);
  var obResponse = [splitString.slice(0, firstThird), splitString.slice(firstThird, secondThird), splitString.slice(secondThird, splitString.length)]
  return obResponse;
}
var segments = "test a b c d e f g h i j k l m n o ".splitInto3();
console.log("First third ("+segments[0].length+"): "+segments[0]);
console.log("Second third ("+segments[1].length+"): "+segments[1]);
console.log("Third third ("+segments[2].length+"): "+segments[2]);

String.prototype.splitInto = function (parts) {
  const splitString = this.trim().split(" ");
  obResponse = {};
  obResponse.values = [];
  var chunkSize = Math.floor(splitString.length/(parts));
  var spares = splitString.length%parts;
  var start = 0;
  for(var i = 0; i < parts; i++) {
    obResponse.values[i] = splitString.slice(start, start+chunkSize+(spares>i?1:0));
    start = start+chunkSize+(spares>i?1:0);
  }
  return obResponse;
}
var segments = "test a b k l m n o ".splitInto(3);
console.log(segments.values);