使用js 完成chrome web 自动化或者爬虫模版例子

js 复制代码

async function executeSteps() {
//插线
    var notes_list = [];

    var total_height=document.querySelector("#pack_virtual_lists").scrollHeight
    var scroll_height =0
    while (scroll_height<=total_height) {
    document.querySelector("#pack_virtual_lists").scrollTop+=100
    scroll_height+=100
    await delay(1000)
    console.log(document.querySelector("#pack_virtual_lists").scrollTop)



   // 获取节点列表
   var notes = document.querySelector("#pack_virtual_lists").childNodes;
   var div_count = notes[0].childElementCount;

   try{
   for (let i = 0; i < div_count; i++) {
        var current_notes = notes[0].childNodes[i]
       if (notes_list.includes(current_notes))
       {
       continue;
       }
       else
       {
       notes_list.push(current_notes);
       }
      var temp = notes[0].childNodes[i].textContent.indexOf("");
      if (temp>=0) {
         var tmp = notes[0].childNodes[i].childNodes[1].childNodes[0].nodeName;
//         var tmp = notes[0].childNodes[0].childNodes[1].textContent;
         if (tmp == "IMG") {
            // 失效名字
            name = notes[0].childNodes[i].childNodes[1].childNodes[0].getAttribute("src").indexOf("dao");
            console.log("zhe");
            if (name != -1) {
               // 选择该包
               notes[0].childNodes[i].click();
               await delay(300); // 等待1秒

               // 点击插线
               document.querySelector("div.ant-row.ant-row-space-between.ant-row-middle > div.btns_rows > div > div > div > button:nth-child(7)").click();
               await delay(300); // 等待1秒

               // 识别开关属性
               document.querySelector("#crossMotorcade").click();
               await delay(300); // 等待1秒

               var first_flag = document.querySelector("#crossMotorcade").getAttribute("ant-click-animating");
               if (first_flag == "false") {
                  document.querySelector("#crossMotorcade").click();
                  await delay(300); // 等待1秒
               }

               // 确定插线
               document.querySelector("div > div.ant-modal-wrap > div > div.ant-modal-content > div.ant-modal-footer > button.ant-btn.ant-btn-primary").click();
               await delay(1000); // 等待1秒

               // 识别是否有没有符合的线就点击取消
               try {
               document.querySelector("div.ant-modal-wrap > div > div.ant-modal-content > div.ant-modal-footer > button.ant-btn.ant-btn-default").click()

               }

                catch (error) {
                console.error("执行骤出错：", error);
                try{
                var message=document.querySelector(".ant-message>div").childElementCount;
                var total_time=0
                while (message!=0)
                {
                console.log("等待");
                await delay(3000); // 等待1秒
                message=document.querySelector(".ant-message>div").childElementCount;
                total_time+=3;
                if (total_time>30)
                {
                break;
                }
                }

                try
                {
//                document.querySelector("div.ant-drawer-content-wrapper > div > div > div.ant-drawer-header > div > button").click()
                document.querySelector("div.ant-drawer-content-wrapper > div > div > div.ant-drawer-header > div > button ").click()
                console.log("关闭成功结果");
                }
                catch(error)
                {
                console.log("没有成功");
                }



                }
                catch(error)
                {
                console.log("结束");
                }


//                await delay(5000); // 等待1秒
                }
            }
         }
      }
   }
   }
   catch(e)
   {
   console.log("超时失败跳过",e)
   }

   }









 // 开始放弃插线
  document.querySelector("#pack_virtual_lists").scrollTop=0;
  var scroll_height =0
  while (scroll_height<=total_height) {
    document.querySelector("#pack_virtual_lists").scrollTop+=100
    scroll_height+=100
    await delay(1000)
    console.log(document.querySelector("#pack_virtual_lists").scrollTop)
    // 获取节点列表
   var notes = document.querySelector("#pack_virtual_lists").childNodes;
   var div_count = notes[0].childElementCount;

    try
    {
     for (let i = 0; i < div_count; i++) {
			var tmp = notes[0].childNodes[i].textContent.indexOf("失败");
			console.log(tmp,"检测失败");
			if (tmp>=0)
			//如果失败就放弃插线
			{
			    notes[0].childNodes[i].click()
			    await delay(1000)

				document.querySelector(
						"#rc-tabs-0-panel-unused > div > div.ant-col.ant-col-17 > div.module.routeslists > div > div > div.ant-alert.ant-alert-error.ant-alert-banner.routesLists_alert > div > div > button:nth-child(3)"
					)
					.click();
				document.querySelector(
						"div > div.ant-popover-inner > div > div.ant-popover-buttons > button.ant-btn.ant-btn-primary.ant-btn-sm"
					)
					.click();

			}
		}
    }
    catch(e)
    {
    console.log("超时失败跳过",e)
    }


    }

}

function delay(ms) {
   return new Promise(resolve => setTimeout(resolve, ms));
}

executeSteps();

这是用JavaScript编写的异步函数，主要用来操作页面元素。

函数executeSteps()首先设置一个空的notes_list数组和总高度total_height，通过查询选择器获取页面元素的滚动高度。

然后，通过while循环，实现向下滚动，每次滚动100的高度，并适当延迟。

接着，通过选择器获取节点列表，并获取其中的元素数量。遍历这些元素，如果它们不在notes_list中，就将它们添加到notes_list。检查元素的文本内容，如果含有"拆包选包"，并且其中的IMG元素含有"dixiao"，则会触发以下操作：点击元素，点击插线按钮，修改开关属性，点击确定插线按钮，尝试点击取消按钮。

如果出错，打印错误信息，并点击关闭按钮。并将"ant-message>div"元素中的子节点数量作为判断依据，如果不为0，就延迟等待。

除此之外，函数executeSteps()还设置了对插线失败的处理，循环中判断如果元素的文本内容包含"插线失败"，就触发放弃插线的操作。如果再次失败，也会打印失败信息。

函数delay()是对JavaScript定时函数setTimeout的封装，用于实现异步延迟。最后执行executeSteps()函数。

总的来说，这段代码主要为了在页面上自动执行一系列的操作，包括滚动页面、查找特定元素、点击按钮、修改属性等，并对可能出错的情况进行处理。
JavaScript作为一种脚本语言，有以下优点用于编写爬虫：

跨平台：JavaScript能运行在多种平台上，包括浏览器、Node.js和其他JavaScript解释器，可跨平台开发爬虫。

强大的库：JavaScript拥有强大的库，如cheerio、puppeteer、request和axios等。这些库提供了许多有用的功能，比如解析HTML、模拟浏览器行为、发起网络请求等。

易于学习和使用：JavaScript语法简单，易于学习和使用。开发者可以用JavaScript快速地编写简单的爬虫，也可以利用库来编写复杂的爬虫。

可扩展性：JavaScript拥有良好的可扩展性，可以轻松地构建模块化的爬虫。开发者可以利用npm（Node.js的包管理器）来安装和维护依赖项。

总之，JavaScript语言和丰富的库提供了许多优势，这使得JavaScript成为一种流行的语言，用于编写爬虫。