PHP编写创建并追加HTML元素的函数遇类型错误，如何解决？

DevOps 小满

2026-7-30

解决DOMNode::appendChild()参数类型错误问题

错误原因

你碰到的TypeError核心问题是：DOMNode::appendChild()要求传入的参数必须是DOMNode对象，但你的createLoginBar函数返回的是拼接好的HTML字符串，并非DOM节点实例，所以触发了类型校验错误。

解决方案

全程基于PHP的DOMDocumentAPI创建、操作元素，让所有生成HTML元素的函数都返回DOMElement（DOMNode的子类）对象，而非字符串。

1. 重写createLoginBar函数（返回DOM节点）

function createLoginBar(DOMDocument $dom): DOMElement {
    // 创建登录栏根div
    $loginBar = $dom->createElement('div');
    $loginBar->setAttribute('class', 'login-bar');

    // 追加子元素，比如登录按钮
    $loginBtn = $dom->createElement('button', '登录');
    $loginBtn->setAttribute('id', 'login-btn');
    $loginBar->appendChild($loginBtn);

    return $loginBar;
}

2. 在createLogoutBanner中调用并追加节点

function createLogoutBanner(DOMDocument $dom): DOMElement {
    $banner = $dom->createElement('div');
    $banner->setAttribute('class', 'logout-banner');

    // 直接传入createLoginBar返回的DOM节点
    $loginBar = createLoginBar($dom);
    $banner->appendChild($loginBar);

    // 添加其他元素，比如退出链接
    $logoutLink = $dom->createElement('a', '退出');
    $logoutLink->setAttribute('href', '/logout');
    $banner->appendChild($logoutLink);

    return $banner;
}

3. 生成并输出最终HTML

// 初始化DOMDocument
$dom = new DOMDocument('1.0', 'UTF-8');
$dom->preserveWhiteSpace = false; // 避免多余空白节点
$dom->formatOutput = true; // 格式化输出HTML（可选）

// 创建banner节点并追加到DOM
$banner = createLogoutBanner($dom);
$dom->appendChild($banner);

// 输出最终HTML
echo $dom->saveHTML();