QRCode.js是javascript實(shí)現(xiàn)二維碼(QRCode)制作生成庫(kù)。 QRCode.js有著良好的跨瀏覽器兼容性（高版本使用HTML5的 Canvas，低版本IE使用table元素繪制），而且QRCode.js沒(méi)有任何依賴(lài)。只需要引用一個(gè)JS。

此插件是能夠獨(dú)立使用的，體積也比較小，使用gzip壓縮后才不到4kb。因?yàn)樗侵苯釉诳蛻?hù)端生成的條碼，所以不會(huì)有圖片下載的過(guò)程，能夠?qū)崿F(xiàn)快速生成。它是基于一個(gè)多語(yǔ)言的類(lèi)庫(kù)封裝的，也不依賴(lài)于其他額外的服務(wù)。

注* 它也支持使用SVG繪制二維碼

基本使用

注* 首先需要添加對(duì)qrcode.js的引用，并創(chuàng)建一個(gè)空DIV

<div id="qrcode"></div> <script type="text/javascript"> new QRCode(document.getElementById("qrcode"), "http://jindo.dev.naver.com/collie"); </script>

還有更多參數(shù)可以選

var qrcode = new QRCode("test", {
 text: "http://jindo.dev.naver.com/collie",
 width: 128,
 height: 128,
 colorDark : "#000000",
 colorLight : "#ffffff",
 correctLevel : QRCode.CorrectLevel.H
});

你可以動(dòng)態(tài)地改變二維碼圖片，速度很快

qrcode.clear();
qrcode.makeCode("http://naver.com");

瀏覽器支持

幾乎支持所有瀏覽器： IE6~10, Chrome, Firefox, Safari, Opera, Mobile Safari, Android, Windows Mobile.

DEMO地址： http://davidshimjs.github.io/qrcodejs

注* 這里有一個(gè)Server端使用Node.JS生成二維碼圖片的庫(kù)，有興趣的同學(xué)也可以研究一下： https://github.com/soldair/node-qrcode

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章:

二維碼
js

相關(guān)文章

js中的 || 與 && 運(yùn)算符詳解
這篇文章主要介紹了js中的 || 與 && 運(yùn)算符詳解,需要的朋友可以參考下
2018-05-05
深入理解JSON數(shù)據(jù)源格式
JSON 在很多場(chǎng)合下作為數(shù)據(jù)格式比XML要更加方便。JSON的數(shù)據(jù)由對(duì)象、數(shù)組和元素等格式組成。每種格式都可以包含合法的JavaScript數(shù)據(jù)類(lèi)型
2014-01-01
如何通過(guò)非數(shù)字與字符的方式實(shí)現(xiàn)PHP WebShell詳解
這篇文章主要給大家介紹了關(guān)于如何通過(guò)非數(shù)字與字符的方式實(shí)現(xiàn)PHP WebShell的相關(guān)資料，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面來(lái)一起看看吧。
2017-07-07
JavaScript學(xué)習(xí)教程之cookie與webstorage
這篇文章主要給大家介紹了關(guān)于JavaScript學(xué)習(xí)教程之cookie與webstorage的相關(guān)資料，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家學(xué)習(xí)或者使用JavaScript具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2019-06-06
javascript去除字符串左右兩端的空格
這篇文章主要介紹了javascript去除字符串左右兩端的空格,需要的朋友可以參考下
2015-02-02
table insertRow、deleteRow定義和用法總結(jié)
這篇文章主要對(duì)table insertRow、deleteRow定義和用法做下總結(jié),需要的朋友可以參考下
2014-05-05
JS獲取地址欄參數(shù)的兩種方法(簡(jiǎn)單實(shí)用)
這篇文章主要介紹了JS獲取地址欄參數(shù)的兩種方法(簡(jiǎn)單實(shí)用)，小編給大家推薦使用第一種采用正則表達(dá)式獲取地址欄參數(shù)的方法，此方法簡(jiǎn)單實(shí)用，對(duì)js獲取地址欄參數(shù)相關(guān)知識(shí)感興趣的朋友，一起學(xué)習(xí)吧
2016-06-06
微信小程序?qū)崿F(xiàn)錨點(diǎn)定位功能的方法實(shí)例
“錨點(diǎn)”功能在實(shí)際應(yīng)用設(shè)計(jì)的好,可以提高用戶(hù)體驗(yàn),這篇文章主要給大家介紹了關(guān)于微信小程序?qū)崿F(xiàn)錨點(diǎn)定位功能的相關(guān)資料,文中通過(guò)示例代碼介紹的非常詳細(xì),需要的朋友可以參考下
2021-07-07
JavaScript簡(jiǎn)單驗(yàn)證表單空值及郵箱格式的方法
這篇文章主要介紹了JavaScript簡(jiǎn)單驗(yàn)證表單空值及郵箱格式的方法,涉及javascript基本的表單與字符串操作相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2017-01-01
JavaScript進(jìn)階練習(xí)及簡(jiǎn)單實(shí)例分析
下面小編就為大家?guī)?lái)一篇JavaScript進(jìn)階練習(xí)及簡(jiǎn)單實(shí)例分析。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2016-06-06