Question

注1 ：我不拥有该网站，因此无法通过编辑更改源代码。
注意2 ：我需要PURE JavaScript（不是jquery）解决方案。（请不要问'为什么不？'或者尝试建议我使用它。）

有一个（随机）页面，里面有一个表格。表具有（ofcorse）表数据单元格。它看起来像这样：

<div>

    <table class="mytable">
        <tbody>
            <tr>
                <td><label>First Name:</label></td>
                <td>John</td>
            </tr>
            <tr>
                <td><span>Last Name:</span></td>
                <td>Smith</td>
            </tr>
            <tr>
                <td><label>City:</label></td>
                <td>BRONX</td>
            </tr>
            <tr>
                <td><strong>State:</strong></td>
                <td>NY</td>
            </tr>
            <tr>
                <td>Go to this website:&nbsp;</td>
                <td><span><a href="https://somesite.com/">https://somesite.com/</a></span></td>
            </tr>
        </tbody>
    </table>

</div>

正如你所看到的，最后一个单元格（表数据）要求我去'somesite [dot] com'，在那里我应该通过填写一个表格（在某个地方）用'名字，姓氏，城市和州。现在，'有趣'的事情是，当我最终按下'somesite [dot] com上的'搜索'按钮时，我的浏览器地址最终会像这样：

https://somesite.com/find/search-results-table?city=BRONX&first_name=John&last_name=Smith&addressType=ANY&state=NY

这是一次，所以你可以看到我的意思：

https://somesite.com/find/search-results-table?city=的 BRONX ＆安培;如first_name = 约翰＆安培;姓氏=的史密斯＆安培;地址类型= ANY＆安培;状态= NY

因此，如您所见，搜索结果页面通过使用名字，姓氏，城市和州作为链接的一部分（通过从数据库中提取）生成链接。

我想要的是在我获得该信息的第一个网站上重新创建该超链接，而无需去“somesite [dot] com”以“浪费时间”填写所有必填字段（名字，姓氏，城市和州）。我想创建一个带有按钮的超级链接，当我按下它时，将直接打开某个地点[点] com搜索结果，我应该通过'manualy填写给定信息'找到该人。

现在，我可以（我知道如何）使用'createElement'创建一个按钮。我还可以为它添加一个id，我可以将该按钮添加到包含表格的div元素（来自我的示例），但是使用'appendChild'。

我在这里和其他页面上使用谷歌进行搜索，我找不到如何从特定元素“复制”innerHTML或“textNode”，然后使用该（我猜）变量将其“放入” 'text patern'，最后会创建一个'工作'超链接，我可以攻击按钮。因此，一旦我按下按钮，我将直接进入某个站点，但是我不会填写所需的信息，而是通过手动输入来查找我应该搜索的那个人的搜索结果页面。

我无法弄清楚如何使用javascript来做到这一点。：（

我希望我能够解释我的需要。

提前感谢所有试图帮助我的人！

Answer 1

安装您选择的用户脚本管理器（例如Tampermonkey），然后使用它来更改第一个站点上的锚链接：

const secondTds = [...document.querySelectorAll('.mytable td:nth-child(2)')];
const linkTd = secondTds.pop();
const queryStringValues = secondTds.map(td => td.textContent);
const params = new URLSearchParams();
const paramNames = ['first_name', 'last_name', 'city', 'state'];
queryStringValues.forEach((val, i) => {
  params.set(paramNames[i], val);
});
params.set('addressType', 'ANY');
const url = 'https://somesite.com/find/search-results-table?' + params.toString();
console.log(url);
linkTd.querySelector('a').href = url;

<div>
  <table class="mytable">
    <tbody>
      <tr>
        <td><label>First Name:</label></td>
        <td>John</td>
      </tr>
      <tr>
        <td><span>Last Name:</span></td>
        <td>Smith</td>
      </tr>
      <tr>
        <td><label>City:</label></td>
        <td>BRONX</td>
      </tr>
      <tr>
        <td><strong>State:</strong></td>
        <td>NY</td>
      </tr>
      <tr>
        <td>Go to this website:&nbsp;</td>
        <td><span><a href="https://somesite.com/">https://somesite.com/</a></span></td>
      </tr>
    </tbody>
  </table>

</div>

javascript'build'（创建）一个超链接按钮，添加元素innerHTML值

1 个答案: