文章/答案/技术大牛

发布

社区首页 >问答首页 >使用Prism.js突出显示haskell文件内容

问使用Prism.js突出显示haskell文件内容
EN

Stack Overflow用户

提问于 2020-04-29 18:27:56

回答 1查看 189关注 0票数 0

我尝试使用Prism.js突出显示Haskell代码片段

下面是适当突出显示代码的示例HTML代码

<pre><code id="codecontent1" class="language-haskell">import Data.List
import Data.List.Split (chunksOf)

area h w xs = 2 * h * w + count xs + count (rotate xs)
  where rotate = reverse . transpose
        count = sum . map diff
        diff ys = sum $ zipWith ((abs .) . (-)) (0 : ys) (ys ++ [0])


solve :: [Int] -> Int
solve (h:w:xs) = area h w (chunksOf w $ xs)

main = interact $ show . solve . map read . words
</code></pre>

输出：

但是，当尝试动态加载代码(从github repo)时，它不会正确突出显示。HTML代码：

<pre><code id="codecontent" class="language-haskell">loading..</code></pre>

加载内容的JS代码：

function load_code (probname) {
    var url = 'https://rawgit.com/tuxian-root/hackerrank-solutions/master/' + probname + '.hs';
    var txtFile = new XMLHttpRequest();
    txtFile.open("GET", url, true);
    txtFile.onreadystatechange = function() {
        if (txtFile.readyState === 4) {  // Makes sure the document is ready to parse.
            if (txtFile.status === 200) {  // Makes sure it's found the file.
                allText = txtFile.responseText;
                //lines = txtFile.responseText.split("\n"); // Will separate each line into an array
                document.getElementById("codecontent").textContent = txtFile.responseText;
                document.getElementById("codecontent").setAttribute("class", "language-haskell language-markup");
            }
        }
    }
    txtFile.send(null);
    //document.getElementById("codecontent").setAttribute("class", "language-haskell");
}

调用部分：

<body style="overflow: hidden;" onload="load_code('algorithms/implementation/3d-surface-area.hs')"></body>

输出：

我在下面也试过了，但没有成功。

<pre data-src="https://github.com/tuxian-root/hackerrank-solutions/blob/master/algorithms/implementation/3d-surface-area.hs"></pre>

有人能帮我找找我遗漏的东西吗？

javascript

html

prism.js

回答 1

Stack Overflow用户

回答已采纳

发布于 2020-05-01 20:22:27

我发现了这个问题，在下载prinm.css/prism.js时，我错过了文件突出显示选项

参考：https://stackoverflow.com/a/54246906/2173020

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/61499617

复制

相似问题

问使用Prism.js突出显示haskell文件内容
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使用Prism.js突出显示haskell文件内容EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使用Prism.js突出显示haskell文件内容
EN