jQuery не находит элемент `span`, возвращенный Django

#javascript #jquery #django #django-templates #katex

#javascript #jquery #django #django-шаблоны #katex

Вопрос:

У меня возникли проблемы с использованием jQuery для извлечения HTML-строки, настроенной Django повторно. В шаблоне Django у меня есть строка

 {{ generated_files.exercise_instructions.content | safe}}
  

который при расширении содержит строку 2. Määritä luvun <span class="inline-math"> -6 </span> vastaluku. , как показано на рисунке ниже:

Расширенная строка JSON (?).

Я хотел бы иметь возможность использовать KaTeX для отображения содержимого элемента span в виде математики, но

 $(".inline-math").each(
        function(i, element) {
          console.log("Rivimatikkaa: "   element.innerHTML);
          katex.render(element.innerHTML,element);
        }
      );
  

ничего не делает для достижения этой цели. Элемент span класса inline-math не обнаруживается jQuery, поскольку console.log(element.innerHTML) он ничего не делает и математика не отображается.

Поэтому мой вопрос заключается в том, как мне определить строку, содержащую LaTeX, возвращаемый Django, чтобы отобразить ее в виде математики с использованием KaTeX?

P.S.

В качестве интересного примечания, вот изображения исходного кода страницы с safe фильтром в теге Django и без него.

безопасность на

Включен безопасный фильтр.

безопасность отключена

Безопасный фильтр отключен.

Обратите внимание на дополнительные амперсанды. Однако это единственное отличие. Строка ни в том, ни в другом случае не интерпретируется как HTML.

Комментарии:

1. Это не связано с django. Если исходный код вашего HTML (посмотрите в инструментах разработчика вашего браузера) содержит span с классом «inline-math», то jQuery $(".inline-math") должен его найти. Откуда вы знаете, что это не так? Нет вывода на консоль? установите точку останова в вашей katex строке и проверьте, что element .

2. Никакого вывода на консоль вообще. Я бы не согласился с тем, что это не связано с django, поскольку теги шаблона определенно влияют на форму, в которой возвращается строка. Например, при пропуске safe фильтра символы < и > в строке путаются.

3. хорошо, но javascript взаимодействует со строкой только после ее загрузки в ваш браузер. Вы сказали, что вывод правильный (<span class=»inline-math»>-6</span>), когда вы просматриваете его в своем браузере, так что теперь это больше не связано с d jango. И да, пометка чего-либо как «безопасного» необходима, чтобы избежать экранирования HTML.

4. Я добавил картинку, чтобы показать, как браузер интерпретирует строку.

5. На вашем скриншоте видно, что браузер не идентифицирует его как HTML. Вы уверены, что использовали safe ?