JavaScript中join方法妙用!!

定义和用法

join() 方法用于把数组中的所有元素转换一个字符串。

元素是通过指定的分隔符进行分隔的。

语法

array.join(separator)

参数值

参数	描述
separator	可选。指定要使用的分隔符。如果省略该参数，则使用逗号作为分隔符。

返回值

类型	描述
String	返回一个字符串。该字符串是通过把 arrayObject 的每个元素转换为字符串，然后把这些字符串连接起来，在两个元素之间插入 separator 字符串而生成的。

例:正常情况下

html:

<p id="demo">点击按钮将数组作为字符串输出。</p>
<button onclick="myFunction()">点我</button>

script:

<script>
function myFunction(){
    var fruits = ["Banana", "Orange", "Apple", "Mango"];
    var x=document.getElementById("demo");
    x.innerHTML=fruits.join(" and ");
}
</script>

点击输出:

Banana and Orange and Apple and Mango

例2:上面例子改下

   <div></div>
    <script type="text/javascript">
    let Div=document.getElementsByTagName('div')[0]
    let list =new Array(5);
    
    Div.innerHTML=list.join('<span></span>') 
    console.log(Div)
    </script>

输出结果:

<div>
    <span></span>
    <span></span>
    <span></span>
    <span></span>
</div>

这样相对于普通添加相对安全!!节省代码