javascript - 在链接中添加span元素，以使其可以使用javascript访问(AA)

我正在尝试修改插件，以使其更现代，更易于访问。问题是图标：我需要添加一个span元素和一些文本以使其可读但不可见。

我的JavaScript是以下内容：

function _createInformationLink(linkText, linkHref) {
    var infoLink = document.createElement('a');

    _setElementText(infoLink, linkText);
    infoLink.href = linkHref;
    infoLink.target = '_blank';
    infoLink.style.marginLeft = '8px';

    return infoLink;
}

我试图添加一行以将.innerHTML注入html，如下所示：

function _createInformationLink(linkText, linkHref) {
    var infoLink = document.createElement('a');

    _setElementText(infoLink, linkText);
    infoLink.href = linkHref;
    infoLink.target = '_blank';
    infoLink.style.marginLeft = '8px';
    infoLink.innerHTML = "<span class='sr-only'>Close cookie policy</span>";

    return infoLink;
}

但这没有用。有什么建议吗？

更新：

函数_setElementText如下：

function _setElementText(element, text) {
    var supportsTextContent = 'textContent' in document.body;

    if (supportsTextContent) {
        element.textContent = text;
    } else {
        element.innerText = text;
    }
}

最佳答案

您可以生成元素，然后将其与文本一起附加：

function _createInformationLink(linkText, linkHref) {
    var infoLink = document.createElement('a');

    _setElementText(infoLink, linkText);
    infoLink.href = linkHref;
    infoLink.target = '_blank';
    infoLink.style.marginLeft = '8px';
    var srSpan = document.createElement('span')
    srSpan.innerText = 'Close cookie policy'
    srSpan.classList.add('sr-only')

    infoLink.appendChild(srSpan);

    return infoLink;
}