Динамический фрагмент кода в Javascript

Question

Динамический фрагмент кода в Javascript

1

Я пишу функцию JS:

showCodeSnippet(fileName)
Input: Local File Name 
Output: Display Code in HTML

Я знаю о ограничениях безопасности, которые ограничивают доступ к локальным файлам в браузере, но удалось создать решение для решения проблемы.

Пожалуйста, рассмотрите этот код (работая над Firefox 57.0, 64-bit):

<html>
<head>
<script src="https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js"></script>
</head>

<body>

<script>

async function showCodeSnippet(fileName) 
{        
    const response = await fetch(fileName);
    const text = await response.text(); 

    var parser = new DOMParser();
    var domString = "<pre class=\"prettyprint\">" + text + "</pre>";
    var html = parser.parseFromString(domString, 'text/html');  
    document.body.append(html.body.firstChild);
}
</script>


<script>
showCodeSnippet('Code.txt');
</script>

</body>
</html>

Code.txt содержит пример кода C++:

using namespace std;
int main()
{
     int n;
     cout << "Enter an integer: ";
     cin >> n;

     if ( n % 2 == 0)
            cout << n << " is even.";
     else
            cout << n << " is odd.";
     return 0;
}

Вывод HTML-страницы:

Постановка задачи:

Подсветка синтаксиса НЕ работает.

Пытался:

Google-prettify
Призма-маркер

Эти маркеры отлично работают в случае статического кода под тегами в HTML.

Может ли кто-нибудь объяснить любую причину этой проблемы или я буду думать в любом другом направлении для достижения такого типа функциональности?

Спасибо

Sandeep Singh 15 авг. 2018, в 17:47

Источник

Теги:

javascript

code-snippets

google-code-prettify

1 ответ

Ещё вопросы

Mephiztopheles · Accepted Answer · 2018-08-15T12-43-00.000Z

Я вижу разницу в Chrome. Когда я использую Firefox, я получаю ту же проблему, что и вы. Подожди, я кое-что проверю :)

Когда вы добавляете PR.prettyPrint(); после вашего добавления, симпатичная печать также будет работать в FireFox. кажется, что автоматическая перекраска не поддерживается в FireFox по коду :(