qrcodejs二维码

使用 qrcodejs生成二维码

qrcode.js 是一个用于生成二维码的 JavaScript 库。主要是通过获取 DOM 的标签,再通过 HTML5 Canvas 绘制而成,不依赖任何库。

安装

npm

npm install --save qrcode

cdn

https://cdn.bootcdn.net/ajax/libs/qrcodejs/1.0.0/qrcode.js

bootcdn搜qrcodejs引用可用版本。

先来看一个例子

<!DOCTYPE>
<html>
<head>
    <meta charset="UTF-8">
    <title>林扬生title>
    <script src="https://cdn.bootcdn.net/ajax/libs/qrcodejs/1.0.0/qrcode.js">script>
head>
<body>
    <div id="qrcode">div>
body>
<script type="text/javascript">
    new QRCode("qrcode", {
        text: "https://www.baidu.com/",
        width: 128,
        height: 128,
        colorDark : "#000000",
        colorLight : "#ffffff",
        correctLevel : QRCode.CorrectLevel.H
    });
script>
html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

使用方法

1.引入qrcode.js

<script src="https://cdn.bootcdn.net/ajax/libs/qrcodejs/1.0.0/qrcode.js"></script>
1

2.DOM结构

<div id="qrcode">div>
1

2.初始化生成的二维码,并设置二维码的宽高，颜色，背景等属性

    new QRCode("qrcode", {
        text: "",
        width: 128,
        height: 128,
        colorDark : "#000000",
        colorLight : "#ffffff",
        correctLevel : QRCode.CorrectLevel.H
    });
1
2
3
4
5
6
7
8

参数说明

new QRCode(element, option)
1

| 名称 | 说明 |
| :–: | :–: | :–😐
| element | 显示二维码的元素或该元素的 ID |
| option | 参数配置 |

option 参数说明