鍍金池/ 問(wèn)答/HTML/ 怎么用javascript拆分字符串并換行

怎么用javascript拆分字符串并換行

//將數(shù)組轉(zhuǎn)換成字符串
var s = ['張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇的', '大師法', '張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇的', '大師法', '張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇的', '大師法', '張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇的', '大師法', '張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇額度', '大師法']
var str = ' ';
var b = s.join(str);
//需要處理每行10個(gè)名字以后換行<br/>

求教大神用什么思路處理

回答
編輯回答
舊時(shí)光

html換行

  var s = ['張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇的', '大師法', '張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇的', '大師法', '張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇的', '大師法', '張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇的', '大師法', '張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇額度', '大師法']
  var str = '';
  for(var i=0;i<s.length;i++){
      str+=s[i]
      if(i>0&&i%10==0){
          str+=`</br>`
      }
  }
  console.log(str)
  document.write(str)

js打印換行

  var s = ['張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇的', '大師法', '張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇的', '大師法', '張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇的', '大師法', '張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇的', '大師法', '張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇額度', '大師法']
  var str = '';
  for(var i=0;i<s.length;i++){
      str+=s[i]
      if(i>0&&i%10==0){
          str+=`\n`
      }
  }
  console.log(str)
2017年1月22日 23:40
編輯回答
玩控

var s = ['張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇的', '大師法', '張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇的', '大師法', '張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇的', '大師法', '張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇的', '大師法', '張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇額度', '大師法']
var str = s.join('');
var newStr = '';
for(var i = 0;i < str.length;i += 10){

newStr += str.substr(i,10) + '<br>';

}
console.log(newStr);

2018年8月17日 22:22
編輯回答
孤客

把s分成多個(gè)數(shù)組，每個(gè)數(shù)組就只能放10個(gè)元素，不就行了

2017年1月29日 20:02
編輯回答
夢(mèng)囈
const s = ['張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇的', '大師法', '張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇的', '大師法', '張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇的', '大師法', '張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇的', '大師法', '張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇額度', '大師法'];
let temp = s.join('').split('');
temp.forEach((t, i) => {if(i > 0 && i % 10 === 0) temp.splice(i, 0, '</br>')});
temp = temp.join('');

運(yùn)行結(jié)果如下：
圖片描述

2017年12月15日 23:03
編輯回答
蝶戀花
str = s.map((item, i) => (i+1) % 10 == 0 ? item + "\n" : item).join(" ").replace(/\n\s/g,'\n');
2017年12月30日 22:37
編輯回答
有你在
var res='';
for(var i=0;i<=s.length;i+=10){res+=s.slice(i,i+10).join(',')+'<br>';}
2018年4月13日 11:04
編輯回答
離夢(mèng)
var s = ['張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇的', '大師法', '張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇的', '大師法', '張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇的', '大師法', '張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇的', '大師法', '張三', '俄方', '好吧', '阿道夫', '氛圍', '斯蒂芬', '劇額度', '大師法']
var res = s.reduce(function (str, item, index) {
  var temp = ''
  if ((index + 1) % 10 === 0) {
    temp = index !== s.length - 1 ? item + '</br>' : item
  } else {
    temp = index !== s.length - 1 ? item + ' ' : item
  }
  return str + temp
}, '')
2017年12月17日 22:32