console 命令行工具 X clear

console

//创建ul
let ul=document.createElement('ul');
//将ul带人
document.body.appendChild(ul);   //只有带body的需要document


//<ul>
    //<li><a href="#">手机</a></li>
    //<li><a href="#">电视</a></li>
    //<li><a href="#">笔记本</a></li>   
    //<li><a href="#">家电</a></ li>
    //<li><a href="#">路由器</a></li>
    //<li><a href="#"> 智能硬件</a></li> 
//<ul>

//开始循环
let text2=['手机','电视','笔记本','家电','路由器','智能硬件']//循环的数组
let net=['http://jsrun.net/dHaKp/edit','http://jsrun.net/5dIKp/edit']
for(var i=0;i<text2.length;i++){
        //创建li
    let li= document.createElement('li');
    //将li带人
    ul.appendChild(li);
    //创建a
    let a= document.createElement('a');
    //将a带人
    li.appendChild(a);
    //创建href
    let href=document.createAttribute('href');
    //href赋值
    href.value=net;
    //href带入
    a.setAttributeNode(href);
    //text创建
    let text=document.createTextNode(text2[i]);//变量不加‘’
    //text带入
    a.appendChild(text);
    //li创建style属性
    let style=document.createAttribute('style');
    //style赋值
    style.value='list-style-type:none ;float: left ;padding: 28px 60px;background-color: skyblue ;'
    //style带人
    li.setAttributeNode(style);
    //style属性赋值list-style-type: none ;float: left ;padding: 28px 60px;
    //a的style属性赋值text -decoration: none;color: #fff;
    let style2=document.createAttribute('style');
    style2.value='text-decoration: none;color: #fff;';
    a.setAttributeNode(style2);
}

<body>
	
</body>