运行某个链接而不点击实际链接按钮
问题描述:
我正在尝试编写替换当前Cookie的脚本,然后转到网站中的链接,然后替换下一个cookie。所有的cookie都存储在一个数组中。 我有下面的代码至今:运行某个链接而不点击实际链接按钮
var i;
for(i=0;i<arr.length;i++){
var cookie = arr[i];
//setting the new cookie that was fetched from the array:
document.cookie = 'cookieName='+cookie+'; path=/';
//Now I need to run the <a href> which links to a relative path
//I am currently in www.mydomain.com/page1/subpage1
//And the href is to /page1/subpage2.I want the script to run this link every iteration
}
我需要运行/page/subpage2
链接,而无需实际点击它使用JS。
该链接实际上并没有改变当前页面,它是运行一些服务器端代码的链接,但你实际上留在www.mydomain.com/page1/subpage1
同一页上,这样你就不必回重定向到page1/subpage1
这是一个简单的网站,并链接没有自己的元素的ID,它与看起来类似的东西链接表:
<table>
<!--more rows here-->
<tr>
<td>
<a class='table-row' href='/page1/subpage2'> Click </a>
</td>
</tr>
<!--more rows here-->
</table>
答
使用的forEach循环数组里面。将el关联到cookie并更改数组元素。然后触发点击具有所需的href的a。
// never define variables inside the loop when possible
var cookie;
arr.forEach(function (el, ind) {
cookie = el;
arr[ind] = 'document.cookie = \"cookieName='+cookie+'; path=/;"';
document.querySelector('a[href="mypath"]').triggerHandler('click');
});
答
您可以创建新的click
事件并像下面的代码那样调度它。
在这个例子中,我们遍历所有类table-row
的链接,听取点击以查看它们是否工作(链接文本onClick的两倍),并为每个链接调度click
。
preventDefault()
用于防止每次点击导航。
ES6语法用于更清晰的代码。
const links = document.getElementsByClassName('table-row');
const forEach = o => fn => Array.prototype.forEach.call(o, fn);
const arr = [];
forEach(links)((link, i) => {
arr[i] = 'document.cookie = \"cookieName='+link.href+'; path=/;"';
// listen to click just to be able to see it in action
link.addEventListener('click', (e) => {
e.preventDefault(); // for testing purposes
const t = document.createTextNode(e.target.textContent);
e.target.appendChild(t);
})
// here you generate a click programmatically:
const customClick = new MouseEvent('click',
{ "view": window, "bubbles": true, "cancelable": true });
link.dispatchEvent(customClick); // generate click
})
<table>
<!--more rows here-->
<tr>
<td>
<a class='table-row' href='/relative/path1'> Click1 </a>
</td>
<td>
<a class='table-row' href='/relative/path2'> Click2 </a>
</td>
<td>
<a class='table-row' href='/relative/path3'> Click3 </a>
</td>
</tr>
<tr>
<td>
<a class='table-row' href='/relative/path4'> Click4 </a>
</td>
<td>
<a class='table-row' href='/relative/path5'> Click5 </a>
</td>
<td>
<a class='table-row' href='/relative/path6'> Click6 </a>
</td>
</tr>
<!--more rows here-->
</table>
我觉得我没有使用正确的单词(点击),我想是该链接将没有鼠标点击自动按下,但JavaScript代码运行的链接,所以也许点击被滥用在这里? – Foobarer
是的,我认为这个解释并不十分清楚。 说实话,我不明白你想达到什么目的。你想执行一些与href点击相关的代码,但是没有真正点击js的链接? – quirimmo
是的,我在代码中也有一个错误,我编辑它,我不小心将cookie写入数组而不是设置它。 也添加了一些更多的解释,希望它会更清晰 – Foobarer