javascript - 在 iMacros 中重新加载页面后，如何定位名称每次都在变化的表单输入字段？

Question

我一直在尝试以网站上的表单为目标，但猜猜我在录制超过 5 次后一次又一次地播放我的 iMacros 脚本后意识到了什么......每次页面重新加载时表单名称和输入名称都会发生变化......也没有其他属性我可以通过它来定位使用 HTML 并且 X/Y 位置记录模式也没有帮助......所以如果你们知道请告诉我..如何让它工作？

这是我试图定位的表单代码，但由于它每次都在变化，所以请问如何完成:

<form action="" method="post">
<div class="uzuyjgec">
<input name="kAEuwLjmplRMZazfl/s9bW6YpnOxDDX2/2K0sobG" class="tbox" type="text">
</div>
<div class="tyqtmvha">
<input name="kwHKrLjmplTDzY/lMx57neltV9ErW378S1mX9h5S" class="tbox" type="text">
</div>
<input name="submit" value="Search!" class="tbox" type="submit">
</form>

我刚刚取出了输入的代码，但是代码中有太多的输入，太让人困惑了……!

这是实时状态下的完整原始代码:http://jsfiddle.net/rt1ff6ab/

它在 jsfiddle 中显示太多处于实时状态的输入，但它在此处的站点中仅显示 2 个输入，请将其截图为:

http://i.stack.imgur.com/451QH.png

Answer 1

根据 JSFiddle 和您显示的图像，看起来有些输入被隐藏了。您可以使用此代码获取可见输入:

var isVisible=function(node){
    return (node.offsetWidth && node.offSetWidth >0) || (node.offsetHeight && node.offsetHeight>0);
};
var inputs=[].filter.call(document.querySelectorAll('input'),isVisible);
var usernameInput=inputs[0];
var hoursInput=inputs[1];

console.log(usernameInput,hoursInput);

代码将页面上的第一个和第二个可见输入记录到控制台。

我 fork 了你的 JSFiddle 并添加了 CSS 以隐藏除了两个输入之外的所有输入:http://jsfiddle.net/28k59uhj/2/

更新:

如果不实际浏览页面，我很难知道如何准确找到您要查找的元素。这是另一个尝试:

var isCandidateRegion=function(node){
    return (node.innerText.indexOf('Username')>-1 && node.innerText.indexOf('Hours')>-1);
};
//Find the last table in th document that contains 'Username' and 'Hours'
var candidateRegions=[].filter.call(document.querySelectorAll('table'),isCandidateRegion);
var targetRegion=candidateRegions[candidateRegions.length-1];

var isVisible=function(node){
    return (node.offsetWidth && node.offSetWidth >0) || (node.offsetHeight && node.offsetHeight>0);
};
var inputs=[].filter.call(targetRegion.querySelectorAll('input'),isVisible);
var usernameInput=inputs[0];
var hoursInput=inputs[1];

console.log(usernameInput,hoursInput);

JSFiddle:http://jsfiddle.net/28k59uhj/3/