Question

我正在尝试使用JavaScript插件显示第三方链接来更改第三方网页上元素的值

我已经在页面上找到了链接，我希望能够单击它我不确定使用document.getElementById是正确的，尽管我不确定如何将id更改为“ a href”，然后将其传递回值。

对不起，这有点棘手，所以我会尽力解释。在我们用于与HR相关的任务的第三方网页上，有一个标题为“文件链接”的部分，尽管这不是链接。当您将地址复制并粘贴到浏览器中时，它将显示文件。我想做的是在“文件链接”部分创建超链接，以消除复制和粘贴链接的需要。因为这是第三方网站。我们可以访问网站上的JavaScript，并且需要将地址更改为超链接。我并不完全确定这是可能的。元素ID为“ __C_cb_file_link”，我想使用变量将链接地址插入元素，然后将链接参数添加到变量中，然后将其重新插入元素/值中。 / p>

function linkIt() {        
        var intoLink = document.getElementById("__C_cb_file_link");  
        var hLink = "<a href="+intoLink+"</a>;  
        intoLink.value = hLink;  
 }  
window.onload = linkIt();

<td><div class="sui-disabled" title="">m-files://view/37FF751C-A23F-4233-BD8B-243834E67731/0-46524?object=C46A7624-D24B-45F3-A301-5117EFC1F674</div>
<input type="hidden" name="__C_cb_file_link" id="__C_cb_file_link" value="m-files://view/37FF751C-A23F-4233-BD8B-243834E67731/0-46524?object=C46A7624-D24B-45F3-A301-5117EFC1F674"/></td></tr>

Answer 1

在下面的代码中，我们首先读取带有新链接的输入值（但是我们可以从其他html标签读取此值），然后删除此元素（和按钮），并将新链接添加到父元素（删除的输入中）< / p>

function linkIt() {
  let intoLink = __C_cb_file_link.value;
  let parent  = __C_cb_file_link.parentNode;
  __C_cb_file_link.remove();
  btn.remove();
  parent.innerHTML += `<a href="${intoLink}">${intoLink}</a>`; 
}

<input id="__C_cb_file_link" value="https://example.com">
<button id="btn" onclick="linkIt()">Link It</button>

Answer 2

[更新]我想您的“ __C_cb_file_link”是一个段落，所以我得到了上一个文本http://mylink.com并创建了一个链接，它是您想要的，对吗？

function linkIt() {     

            let fileLink = document.getElementById("__C_cb_file_link");
            let hLink = fileLink.textContent;
            fileLink.innerHTML =  "<a href="+hLink+">"+hLink+"</a>";
                        
    }  
      linkIt();

<div>  
     <p id="__C_cb_file_link">http://myLink.com</p>
</div>

Answer 3

您的代码存在许多问题：

1）您的问题中的代码段由于在linkIt（）函数第二行末尾缺少"而无法运行。

2）intoLink是一个隐藏字段，因此您添加到其中的任何内容都不会在页面中显示

3）即使第2点不正确，设置表单字段的value也不会导致HTML出现在页面上（充其量您可能会在文本框中看到一些纯文本）。

4）"<a href="+intoLink+"</a>"不起作用，因为intoLink是一个复杂的对象，它代表整个隐藏字段元素（不仅仅是其value属性）。您不能将整个对象直接转换为字符串。您需要提取该字段的value。

一种更好的方法是为超链接创建一个新元素，并将其附加到页面的适当位置。另外，我建议不要通过onload添加事件-使用这种语法编写时，页面中一次只能存在一个onload事件。由于您要修改的页面不在您的控制之下，因此您不想禁用可能定义的任何其他加载事件。请改用addEventListener，这样可以为同一事件指定多个处理程序。

演示：

function linkIt() {
  var intoLink = document.getElementById("__C_cb_file_link");
  var hLink = document.createElement("a");
  hLink.setAttribute("href", intoLink.value);
  hLink.innerHTML = "Click here";
  intoLink.insertAdjacentElement('beforebegin', hLink);
}
window.addEventListener('load', linkIt);

<td>
  <div class="sui-disabled" title="">m-files://view/37FF751C-A23F-4233-BD8B-243834E67731/0-46524?object=C46A7624-D24B-45F3-A301-5117EFC1F674</div>
  <input type="hidden" name="__C_cb_file_link" id="__C_cb_file_link" value="m-files://view/37FF751C-A23F-4233-BD8B-243834E67731/0-46524?object=C46A7624-D24B-45F3-A301-5117EFC1F674" /></td>
</tr>

P.S。 m-files://在大多数浏览器中不是标准协议，除非已安装某种扩展名，所以即使将其变成超链接，它也可能不适用于所有人。

是否可以使用JavaScript更改元素的值

3 个答案: