通过 id 使用 queryselector 自动填充用户名和密码

Question

我正在尝试创建一些简单的 javascript 来自动填充网页。

我想修改以下内容以用于用户名“password_username”和密码“password_password”的特定元素ID

var result = [];

// Get all links from the page need to change to specific for username

var elements = document.querySelectorAll("input");
for (let element of elements) {
element.value = "username";
}

// Get all links from the page need to change to specific for password

var elements = document.querySelectorAll("input");
for (let element of elements) {
element.value = "password";
}

// Call completion to finish
completion(result) `

我才刚刚开始学习代码并且有非常基本的javascript知识，感谢任何帮助！

干杯，

垫子

Answer 1

不完全确定这是否会像想象的那样工作，因为我现在无法测试它，但试一试：

const usernameElements = document.querySelectorAll(`input[type="text"]`);
const passwordElements = document.querySelectorAll(`input[type="password"]`);

usernameElements.forEach(username => username.value = "the user name");
passwordElements.forEach(password => password.value = "the password");

它根据类型（文本/密码）选择输入字段并将值添加到它们。现在我不完全确定您发布的这个是否是更大脚本的一部分，但这可能会满足您的需要。如果您想要不同的用户名和密码，您需要使 username 和 password 变量动态加载，否则这会添加您提供的值，例如 username.value = "testing username" 和 password.value = "testing password" 。干杯。

Answer 2

希望我正确理解了您的问题。

要通过 id 选择特定字段并为其设置值，您可以使用document.querySelector("#the_id").value = "the_value";

如果你有一个 {id: value} 结构的对象，你可以循环处理它：

const creds = {
  id1: 'val1',
  id2: 'val2' // ...
};

for (const [id, val] of Object.entries(creds)) {
  document.querySelector(`#${id}`).value = val;
}

如果我不明白您需要什么，请澄清，我很乐意提供帮助。