原生js实现一个html自定义标签生成二维码组件代码
代码语言:html
所属分类:其他
代码描述:原生js实现一个html自定义标签生成二维码组件代码
代码标签: 原生 js html 自定义 标签 生成 二维码 组件 代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> body { margin: 60px; } </style> </head> <body translate="no"> <h2>Regular Web Page</h2> <p> This is a regular web page. It is so awesome, I bet you want to share it with all your friends. To make that easier, you can generate a QR code by clicking the button below. </p> <qr-component width="200" height="200">Get QRCode</qr-component> <script type="module"> import QrCode from '//repo.bfw.wiki/bfwrepo/js/module/qrcode.mjs'; class QrComponent extends HTMLElement { constructor() { super(); this.width = 250; this.height = 250; this.text = 'Generate QR Code for this URL.'; } connectedCallback() { if (this.getAttribute('width')) this.width = this.getAttribute('width'); if (this.getAttribute('height')) this.height = this.getAttribute('height'); this.attachShadow({ mode: 'open' }). innerHTML = ` .........完整代码请登录后点击上方下载按钮下载查看
网友评论0