如何创建含文本并显示在文本框中的链接？求助这段JavaScript代码

我来帮你一步步解决这两个问题：

一、创建点击后将文本显示到文本框的链接 #

如果你的需求是点击链接时，把指定文本填充到文本框中，可以这样实现：

实现方式 #

• 先定义文本框（<input> 或 <textarea>）和目标链接
• 给链接绑定点击事件，触发时修改文本框的 value 属性

基础示例（内联事件写法）

<!-- 文本框 -->
<input type="text" id="myInput" placeholder="点击链接填充文本">
<!-- 触发链接 -->
<a href="javascript:void(0)" onclick="fillTextToInput()">点击显示文本到文本框</a>

<script>
function fillTextToInput() {
  // 获取文本框元素
  const input = document.getElementById('myInput');
  // 设置要显示的文本内容
  input.value = "你需要展示的文本";
}
</script>

推荐写法（事件监听方式）

这种写法更符合现代前端规范，避免内联代码的耦合：

<input type="text" id="myInput" placeholder="点击链接填充文本">
<a href="javascript:void(0)" id="fillLink">点击显示文本到文本框</a>

<script>
const fillLink = document.getElementById('fillLink');
const input = document.getElementById('myInput');

fillLink.addEventListener('click', function() {
  input.value = "你需要展示的文本";
});
</script>

二、优化你的YAHOO Util Dom代码 #

先拆解原代码的作用：它会在整个文档中查找innerHTML完全等于"Open Help"的<a>标签，找到后处理第一个匹配的元素。这里有几个优化和注意点：

1. 简化条件判断 #

原代码里的三元表达式可以直接简化，因为element.innerHTML === searchText本身就是布尔值：

var elements, searchText = "Open Help";
elements = YAHOO.util.Dom.getElementsBy(function (element) {
    return element.innerHTML === searchText; // 直接返回布尔结果即可
}, "a", document);
if (elements.length > 0) {
    // 对第一个匹配的链接执行操作，举个例子：
    elements[0].style.color = '#2196F3'; // 将链接改成蓝色
    elements[0].addEventListener('click', function(e) {
        e.preventDefault();
        console.log('点击了"Open Help"链接');
    });
}

2. 更鲁棒的文本匹配 #

用innerHTML匹配可能会因为元素内有隐藏标签（比如<span>）或首尾空格导致匹配失败，更推荐用textContent获取纯文本，并加上trim()处理空格：

var elements, searchText = "Open Help";
elements = YAHOO.util.Dom.getElementsBy(function (element) {
    return element.textContent.trim() === searchText.trim();
}, "a", document);

3. 原生JS替代方案（如果不再使用YAHOO库） #

如果项目已经不再依赖YAHOO UI库，可以用原生JS实现相同功能，更轻量：

const searchText = "Open Help";
// 方法1：用find遍历所有a标签
const allLinks = document.querySelectorAll('a');
const targetLink = Array.from(allLinks).find(el => el.textContent.trim() === searchText.trim());

if (targetLink) {
    // 执行你的操作，比如添加高亮样式
    targetLink.classList.add('highlight');
}

// 方法2：更高效的循环遍历
const allLinks = document.getElementsByTagName('a');
let targetLink = null;
for (let i = 0; i < allLinks.length; i++) {
    if (allLinks[i].textContent.trim() === searchText.trim()) {
        targetLink = allLinks[i];
        break; // 找到第一个匹配项就停止循环
    }
}

if (targetLink) {
    // 执行你的操作
}

内容的提问来源于stack exchange，提问作者Null Sep