qrcode.js 创建二维码 指定颜色,中介放logo.png 时间方法

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>生成二维码</title>
<script src="./qrcode.js"></script>
<style>
        #qrcode {
            position: relative;
            display: inline-block;
        }

        #qrcode img.logo {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 150px;
            height: 150px;
        }
    </style>
</head>
<body>
<h1>二维码生成示例</h1>
<div id="qrcode"></div>

<script>
        // 创建二维码
        const qrcodeContainer = document.getElementById('qrcode');
        const qrCode = new QRCode(qrcodeContainer, {
            text: "https://www.xiaoguan.net",
            width: 200, // 二维码宽度
            height: 200, // 二维码高度
            colorDark: "#03499e", // 二维码前景色
            colorLight: "#ffffff", // 二维码背景色
            correctLevel: QRCode.CorrectLevel.H // 容错级别
        });

        // 创建 logo
        const logo = document.createElement('img');
        logo.src = './logo.png'; // logo 图片路径
        logo.alt = 'Logo';
        logo.className = 'logo';
        
        // 将 logo 添加到二维码中心
        qrcodeContainer.appendChild(logo);
    </script>
</body>
</html>