[英]generate links with a greasemonkey script
我正在尝试在Greasemonkey中编写一个脚本,它将在一个框架中生成链接,但由于我有限的Javascript知识,我真的不知道如何做到这一点。
主题示例:
<html>
<head>
<frameset border="0" frameborder="no" framespacing="0" cols="*,280" rows="*">
<frameset border="0" frameborder="NO" framespacing="0" cols="*" rows="*,200">
<frameset border="0" frameborder="NO" framespacing="0" cols="*" rows="75,*">
<frame scrolling="NO" name="bannerFrame" src="banner.php">
<frame scrolling="auto" name="mainFrame" src="main.php">
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<body class="framemainbg" marginwidth="0" marginheight="0" topmargin="0" leftmargin="0">
<table class="areadescription" cellspacing="0" cellpadding="0" border="0">
<br>
<table>
<tbody>
<tr>
<td>
<p class="personlistcaption">Text:</p>
<p class="listusersrow">
<table>
<tbody>
<tr>
<td valign="top">
<td valign="top">
<b>Text </b>
Text -
<a href="fight.php?action=attacknpcmenu&checkid=1347789191&act_npc_id=764">Attack</a>
-
<a class="fastattack" onclick="this.href += '&yscroll=' + window.pageYOffset;" href="fight.php?action=attacknpc&checkid=8409099&act_npc_id=764">Quickattack</a>
<br>
Text
</td>
</tr>
</tbody>
</table>
</p>
</td>
</tr>
</tbody>
</table>
<br>
<table>
<form name="formular">
</body>
</html>
</frame>
</frameset>
<frameset border="0" frameborder="NO" framespacing="0" cols="*" rows="*,0">
</frameset>
<frameset border="0" frameborder="NO" framespacing="0" cols="*" rows="*,360">
</frameset>
<noframes><body> Text </body></noframes>
</html>
期望输出的示例:
<html>
<head>
<frameset border="0" frameborder="no" framespacing="0" cols="*,280" rows="*">
<frameset border="0" frameborder="NO" framespacing="0" cols="*" rows="*,200">
<frameset border="0" frameborder="NO" framespacing="0" cols="*" rows="75,*">
<frame scrolling="NO" name="bannerFrame" src="banner.php">
<frame scrolling="auto" name="mainFrame" src="main.php">
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<body class="framemainbg" marginwidth="0" marginheight="0" topmargin="0" leftmargin="0">
<table class="areadescription" cellspacing="0" cellpadding="0" border="0">
<br>
<table>
<tbody>
<tr>
<td>
<p class="personlistcaption">Text:</p>
<p class="listusersrow">
<table>
<tbody>
<tr>
<td valign="top">
<td valign="top">
<b>Text </b>
Text -
<a href="fight.php?action=attacknpcmenu&checkid=1347789191&act_npc_id=764">Attack</a>
-
<a class="fastattack" onclick="this.href += '&yscroll=' + window.pageYOffset;" href="fight.php?action=attacknpc&checkid=8409099act_npc_id=764">Quickattack</a>
-
<a href="fight.php?action=slapnpc&checkid=8409099&act_npc_id=764&mark=0">Hit</a>
-
<a href="fight.php?action=chasenpc&checkid=8409099&act_npc_id=764&">Chase</a>
<br>
Text
</td>
</tr>
</tbody>
</table>
</p>
</td>
</tr>
</tbody>
</table>
<br>
<table>
<form name="formular">
</body>
</html>
</frame>
</frameset>
<frameset border="0" frameborder="NO" framespacing="0" cols="*" rows="*,0">
</frameset>
<frameset border="0" frameborder="NO" framespacing="0" cols="*" rows="*,360">
</frameset>
<noframes><body> Text </body></noframes>
</html>
应该生成此链接:
-
<a href="fight.php?action=slapnpc&checkid=8409099&act_npc_id=764&mark=0">Hit</a>
-
<a href="fight.php?action=chasenpc&checkid=8409099&act_npc_id=764&">Chase</a>
'checkid = ...'和'npc_id = ...'必须与此链接中的值相同:
<a class="fastattack" onclick="this.href += '&yscroll=' + window.pageYOffset;" href="fight.php?action=attacknpc&checkid=8409099act_npc_id=764">Quickattack</a>
好吧,这实际上只是基本的HTML DOM操作 ,这里没有GreaseMonkey特有的 。
首先,我将假设您要复制URL参数的链接是唯一一个class="fastattack"
,因为这样可以轻松找到它 :
var link = document.getElementsByClassName( 'fastattack' )[0];
if ( link ) {
// we found the link, do stuff with it...
接下来,我们需要生成第一个新链接 :
var newlink = document.createElement( 'a' );
...让它指向我们想要的网址 :
newlink.href = link.href.replace( 'action=attacknpc', 'action=slapnpc' );
...并给它我们想要的链接文本 :
newlink.textContent = 'Hit';
接下来,我们在原始链接之后将新链接插入DOM ,如下所示:
var nextNode = link.nextSibling;
link.parentNode.insertBefore( newlink, nextNode );
哎呀,我们忘了先插入分隔符 ! 不用担心,我们仍然可以这样做:
var delim = document.createTextNode( ' - ' );
link.parentNode.insertBefore( delim, newlink );
现在我们可以为其他链接做同样的事情:
var newlink2 = document.createElement( 'a' );
newlink2.href = link.href.replace( 'action=attacknpc', 'action=chasenpc' );
newlink2.textContent = 'Chase';
link.parentNode.insertBefore( delim.cloneNode( true ), nextNode );
link.parentNode.insertBefore( newlink2, nextNode );
这一次,我记得首先插入分隔符。 我使用了与上面相同的delim
节点,但我复制了它,因为我想插入另一个相同的分隔符,而不是将原始分隔符移动到DOM中的新位置。
最后,我们需要关闭if
块,就是这样:
}
(免责声明:我实际上没有测试过上面的代码。我认为它应该可行,但可能存在我错过的错误或错别字。)
编辑:更改代码以在原始段落之后插入新链接,而不是在父段落的末尾。
附录:如果您在文档中有多个带class="fastattack"
链接,并且希望将上面的代码应用于每个链接,您可以通过在上面的前两行替换所有链接上的循环来代替只是第一个:
var links = document.getElementsByClassName( 'fastattack' );
for ( var i = 0; i < links.length; i++ ) {
var link = links[i];
// now do stuff with link just like above
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.