<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="js/jquery-2.2.2.min.js"></script> <title></title> <style> ul li p.name{ color: red; } </style> </head> <body> <ul id="box"> </ul> <script type="text/javascript"> var box = document.getElementById('box'); //从前端获取后端的数据 var data = [ {id:1,name:'小米8',subName:'你真好',price:98}, {id:2,name:'小米6',subName:'你真好2',price:948}, {id:3,name:'小米4',subName:'你真好3',price:100}, {id:4,name:'小米2',subName:'你真好4',price:928}, {id:5,name:'小米10',subName:'你真好5',price:918} ]; for(var i=0;i<data.length;i++){ var li=document.createElement('li') li.innerHTML=`<p class="name">${data[i].name}</p> <p class="subName">${data[i].subName}</p> <span class="price">${data[i].price}</span>元`; box.appendChild(li) } delchild(); function delchild(){ var ul = document.getElementById('box'); // 创建节点 var li1 = document.createElement('li'); var li2 = document.createElement('li'); li1.innerHTML = '<a href="#">123</a>'; li1.setAttribute('class','active'); console.log(li1.children); li1.children[0].style.color = 'red'; li1.children[0].style.fontSize = '20px'; ul.appendChild(li1); // ul.appendChild(li2); // li2.innerHTML = '第一个'; ul.insertBefore(li2,li1); // ul.removeChild(li2); } if(isExist()) { console.log('不操作'); } /* function isExist(){ //循环ul节点 var liList=$("#box").children("li") for(var i=0;i<liList.length;i++){ var pl=liList.eq(i).find("p"); for (var j=0;j<pl.length;j++) { console.log(pl.eq(j).text()); } } } */ function isExist(){ //循环ul节点 var liList=$("#box").children("li") for(var i=0;i<liList.length;i++){ var pl=liList.eq(i).find("p"); for (var j=0;j<pl.length;j++) { if(pl.eq(j).text()==='小米8') { return true; } //console.log(pl.eq(j).text()); } return false; } } </script> </body> </html>