This demonstrates one method for creating JavaScript based Anki cards.
Tested on
- Anki for desktop computers version 2.1.13
- AnkiMobile (iOS) version 2.0.48
- Ensure you have synchronized all your Anki clients
- Open Anki for desktop computers
- Click Create Deck
- Enter
Test
for the desk name and click OK - Click the
Test
deck - Click
Add
- Click the Type button
- Click Manage → Add
- Select Clone: Basic and click OK
- Enter
Script
for Name and click OK - Close the window
- Select Script and click Choose
- Click Cards...
- Enter the following for Front Template:
NOTE: You can ignore the "Invalid HTML on card: ReferenceError: Front is not defined" error.
<div id="front" class="card">Loading front...</div> <script> var code = (function () {/* {{Front}} */}).toString(); code = code.slice(16, code.length - 4); eval(new DOMParser().parseFromString(code, "text/html").documentElement.textContent); </script>
- Enter the following for Back Template (ignore the "Invalid HTML on card: ReferenceError: Back is not defined" error):
NOTE: You can ignore the "Invalid HTML on card: ReferenceError: Back is not defined" error.
<div id="back" class="card">Loading back...</div> <script> var code = (function () {/* {{Back}} */}).toString(); code = code.slice(16, code.length - 4); eval(new DOMParser().parseFromString(code, "text/html").documentElement.textContent); </script>
- Click Close
- Enter the following for Front:
window.now = new Date(); document.getElementById('front').innerHTML = 'What is the current year?';
- Enter the following for Back:
document.getElementById('back').innerHTML = 'Current year: ' + window.now.getFullYear();
- Click Add
- Click Close
- Click Study Now → Show Answer
brilliant!