求助：为外部及邮件链接自动生成无障碍链接标题（TYPO3）

前端JavaScript实现（通用场景） #

直接在页面中插入以下脚本，即可自动为符合条件的链接添加对应提示标题：

document.addEventListener('DOMContentLoaded', function() {
  const currentSiteDomain = window.location.hostname;
  const allLinks = document.querySelectorAll('a');

  allLinks.forEach(link => {
    // 处理带target="_blank"的外部链接
    if (link.target === '_blank') {
      try {
        const linkDomain = new URL(link.href).hostname;
        if (linkDomain !== currentSiteDomain) {
          // 保留原有title并追加提示，无则直接设置
          link.title = link.title ? `${link.title} (opens external link)` : 'opens external link';
        }
      } catch (e) {
        // 处理无效URL的情况
        console.warn('Invalid link URL:', link.href);
      }
    }

    // 处理邮件链接
    if (link.href.startsWith('mailto:')) {
      link.title = link.title ? `${link.title} (opens email program)` : 'opens email program';
    }
  });
});

TYPO3后端实现（适配CMS场景） #

如果你使用TYPO3，可以通过以下两种方式实现：

1. TypoScript配置（快速生效）

在你的模板setup.ts中添加如下配置，利用TYPO3内置的链接解析机制：

# 为外部新窗口链接设置标题
lib.parseFunc_RTE.externalLinks {
  target = _blank
  title = opens external link
}

# 为邮件链接设置标题
lib.parseFunc_RTE.mailLinks {
  title = opens email program
}

该配置会自动处理RTE编辑器中插入的外部链接和邮件链接，渲染时自动添加上对应的title属性。

2. 自定义内容处理器（高级需求）

如果需要更灵活的逻辑（比如排除特定域名），可以编写一个自定义的链接处理器类，注册为TYPO3的内容渲染钩子，示例逻辑如下：

<?php
namespace Vendor\Extension\Hooks;

use TYPO3\CMS\Core\Utility\GeneralUtility;
use TYPO3\CMS\Frontend\ContentObject\ContentObjectRenderer;

class LinkTitleProcessor
{
    public function processLink(array $linkData, ContentObjectRenderer $cObj): array
    {
        // 处理外部新窗口链接
        if ($linkData['target'] === '_blank' && strpos($linkData['url'], 'http') === 0) {
            $linkDomain = parse_url($linkData['url'], PHP_URL_HOST);
            $currentDomain = GeneralUtility::getIndpEnv('HTTP_HOST');
            if ($linkDomain !== $currentDomain) {
                $linkData['title'] = $linkData['title'] ? $linkData['title'] . ' (opens external link)' : 'opens external link';
            }
        }

        // 处理邮件链接
        if (strpos($linkData['url'], 'mailto:') === 0) {
            $linkData['title'] = $linkData['title'] ? $linkData['title'] . ' (opens email program)' : 'opens email program';
        }

        return $linkData;
    }
}

然后在ext_localconf.php中注册钩子：

$GLOBALS['TYPO3_CONF_VARS']['SC_OPTIONS']['tslib/class.tslib_content.php']['typoLink_PostProc']['vendor_extension'] =
    \Vendor\Extension\Hooks\LinkTitleProcessor::class . '->processLink';

无障碍意义说明 #

这类提示标题能帮助屏幕阅读器用户提前了解链接的打开行为，避免突然跳转新窗口或打开邮件程序带来的困惑，符合WCAG无障碍标准的要求。

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