Перейти к содержимому

Anki — Инструкция (нужно запомнить важные моменты при использовании программы) (по Анки) (JavaScript — в Anki)

Чтобы в карточке выводилось поле с вводом ответа, нужно перед название поля написать ‘type:’
Например:’type:example‘

и тогда когда мы выведем это же название поля, то выведеться не значение этого поля, а разница между введеным значением и результатом.

Чтобы вместо значения поля выводилось «показать [название поля]», а только после нажатия выводилось значение поля, тогда для этого нужно перед названием поля ввести «hint:»
Например:’hint:example‘

Чтобы выводить заголовок группу и только после нажатия на него вывести его потомков нужно сделать следующим образом.

<details>
<summary>Группа-1</summary>
Ветка-1
Ветка-2
...
Ветка-n
</details>

Группа-1 Ветка-1
Ветка-2
…
Ветка-n

⚹ 4  
<script>
var content = document.getElementById("sentence").innerHTML;

var unpunctuated = replacePunctuation(content);
var words = (unpunctuated).split(" ");

var punctuatedWords = (content).split(" ");

var processed = "";
for (i=0; i<words.length;i++) {
  processed+="<a href=\"https://dictinary.cambridge.org/dictionary/english-russian/" + words[i]+"\">";
  processed+= punctuatedWords[i];
  processed+="</a>"
  for (i=0; i<words.length;i++) {
  processed+=punctuatedWords[i];
  processed+="</a>"
}

document.getElementById("sentence").innerHTML = processed;

function replacePunctuation(s) {
  var punctuationless = s.replace(/[.,V#!S%\^&\*;:{}=\-_`~()]/g,"");
  var finalString = punctuationless.replace(/\s(2,)/g,"");
  return s;
 }
</script>

<div id="sentence">{{пример}}</div>

Объяснение работы программы (кода)

Данный код является скриптом на языке JavaScript, который выполняет следующие действия:

  1. Получает содержимое элемента с id «sentence» (этот элемент должен быть на странице HTML, на которой используется данный скрипт).
  2. Удаляет знаки препинания из текста, используя функцию replacePunctuation.
  3. Разбивает текст на слова, используя пробел как разделитель.
  4. Разбивает исходный текст на слова, используя пробел как разделитель.
  5. Для каждого слова в тексте создает HTML-ссылку на перевод данного слова на сайте Cambridge Dictionary.
  6. Заменяет исходный текст на новый HTML-код, в котором каждое слово является ссылкой на перевод в словаре.
  7. Функция replacePunctuation удаляет из переданной строки все знаки препинания и двойные пробелы, возвращая обработанную строку.

В коде используется тег div содержимое которого «If you’ve ( picked up this book,» и заменяется в результате выполнения скрипта.

<div id="sentence">If you’ve ( picked up   this book,</div>

Вот пример моей колоды, с двумя картам и соответственно Лицо и Оборот

CARD 1 / Лицо

<div class="css_comment">
тип-1 карта-{{number}}
</div>

<div class="css_phrase">
{{English_phrase}}
</div>
<br>
<div class="css_word">
{{English_word}}
</div>
{{English_Sound}}<br>

<div class="css_phrase">
{{Deutsch_phrase}}
</div>
<br>
<div class="css_word">
{{Deutsch_word}}
</div>
{{Deutsch_Sound}}

<div class="css_comment">
<details>
<br>
<summary>russia</summary>
<br>
<div class="css_phrase_2">
{{Russia_phrase}}
</div>
<br>
<div class="css_word">
{{Russia_word}}
</div>
{{Russia_Sound}}
</details>
</div>

{{image}}

CARD 1 / Оборот

<div class="css_phrase_2">
{{Russia_phrase}}
</div>
<br>
<div class="css_word">
{{Russia_word}}
</div>
{{Russia_Sound}}

<div class="css_comment">
<details>
<br>
<summary>deutsch</summary>
<br>
<div class="css_phrase">
{{Deutsch_phrase}}
</div>
<br>
<div class="css_word">
{{Deutsch_word}}
</div>
{{Deutsch_Sound}}
</details>
</div>

CARD 2 / Лицо

<div class="css_comment">
тип-2 карта-{{number}}
</div>

<div class="css_phrase_2">
{{Russia_phrase}}
</div>
<br>
<div class="css_word">
{{Russia_word}}
</div>
{{Russia_Sound}}

<div class="css_comment">
<details>
<br>
<summary>deutsch</summary>
<br>
<div class="css_phrase">
{{Deutsch_phrase}}
</div>
<br>
<div class="css_word">
{{Deutsch_word}}
</div>
{{Deutsch_Sound}}
</details>
</div>
{{image}}

CARD 2 / Оборот

<div class="css_phrase">
{{English_phrase}}
</div>
<br>
<div class="css_word">
{{English_word}}
</div>
{{English_Sound}}<br>

<div class="css_phrase">
{{Deutsch_phrase}}
</div>
<br>
<div class="css_word">
{{Deutsch_word}}
</div>
{{Deutsch_Sound}}

<div class="css_comment">
<details>
<br>
<summary>russia</summary>
<br>
<div class="css_phrase_2">
{{Russia_phrase}}
</div>
<br>
<div class="css_word">
{{Russia_word}}
</div>
{{Russia_Sound}}
</details>
</div>

Добавить комментарий