js实现网页自动化

article/2025/10/11 1:02:42

不讲废话，直接主题

一、总览

在这里插入图片描述

二、元素获取

1、原生获取

在这里插入图片描述

2、jq获取

在这里插入图片描述

三、元素操作

$0 代表当前元素，下面给几个典型的例子，其他以此类推。

1、文本框

$0.value = "United States"

2、下拉框

$0.value = "United States"
$0.options[1].selected =true

四、事件触发

事件文档: https://developer.mozilla.org/en-us/docs/Web/API/Event/Event

1、直接触发

$0.click()

2、jq触发

$0.trigger("click");

3、原生触发

$0.dispatchEvent(new Event("click"))

IE使用

$0.fireEvent(new Event("click"))

五、demo

1、滑动

//滑块
function sendEvent(elem, event, clientX, clientY) {var mousemove = new MouseEvent(event,{bubbles: true,clientX: clientX,clientY: clientY,});elem.dispatchEvent(mousemove);
}function dragandDrop(elem, distance) {var x = 0, interval;var rect = elem.getBoundingClientRect();var startx = Math.floor(rect.x + rect.width / 2);var starty = Math.floor(rect.y + rect.height / 2);sendEvent(elem, "mousedown", startx, starty);interval = setInterval(function() {x++;sendEvent(elem, "mousemove", startx + x, starty);if (x >= distance) {clearInterval(interval);sendEvent(elem, "mouseup", x, 0);}}, 10);
}dragandDrop(document.getElementById("tcaptcha_drag_thumb"), 100)

2、内置frame操作

IE

document.frames[i].document.getElementById('元素的ID');
document.frames['iframe的name'].document.getElementById('元素的ID');
document.getElementById('iframe的ID').contentWindow.document.getElementById('元素的ID')

其它

跨域frame 暂不知道如何操作

3 常用函数

function getElementLeft(element) {var actualLeft = element.offsetLeft;var current = element.offsetParent;while (current !== null) {actualLeft += current.offsetLeft;current = current.offsetParent;}return actualLeft;
}