英文:
PyScript: running code blocks in between paragraphs in HTML?
问题
I've been looking for a way to run interactive python code blocks on my personal website, and PyScript looked to be a good solution. However, it seems like PyScript is currently designed to always output at the end of HTML
tags, rather than in between sections of HTML code.<script defer src="https://pyscript.net/latest/pyscript.js"></script>
<div>
<div>
<py-env>
<py-script src="indexcode.py" std-out="output">
</py-script>
</py-env>
</div>
</div>
<div id="output"></div>
<p>This is a block of HTML</p>
In the code above, I tried to define a separate
Screenshot of resulting code on my website
I'm wondering if there's any good solution to this? None of the examples on PyScript's website had anything close to this. I understand that PyScript's relatively new, so it's possible that this just isn't a feature yet.
英文:
I've been looking for a way to run interactive python code blocks on my personal website, and PyScript looked to be a good solution. However, it seems like PyScript is currently designed to always output at the end of HTML <body> tags, rather than in between sections of HTML code.
<script defer src="https://pyscript.net/latest/pyscript.js"></script>
<div>
<div>
<py-env>
<py-script src="indexcode.py" std-out="output">
</py-script>
</py-env>
</div>
</div>
<div id="output"></div>
<p>This is a block of HTML</p>
In the code above, I tried to define a separate <div> tag to take the output of my PyScript code using the std-out attribute, but this doesn't seem to affect the position of the output, (where the code is outputted, then the "This is a block of HTML" section follows.)
Screenshot of resulting code on my website
I'm wondering if there's any good solution to this? None of the examples on PyScript's website had anything close to this. I understand that PyScript's relatively new, so it's possible that this just isn't a feature yet.
答案1
得分: 0
PyScript引入了一个新的“内置”函数(即无需导入的函数),称为display(),用于将文本内容发送到页面。 display()
接受一个可选的关键字参数target
,用于指定要将内容写入的DOM元素的ID。如果未指定target
,则内容将显示为当前
输出顺序如下:
Up Top
AAA
One
BBB
Two
CCC
英文:
PyScript introduces a new "built-in" function (i.e. a function you do not need to import) called display() for this use case, of sending text content to the page. display()
takes an optional keyword argument called target
, which specifies the ID of a DOM element to write the content to. If target
is not specified, the content appears as a child element of the current <py-script> (or <py-repl>) tag.
<div id="verytop"></div>
<p>AAA</p>
<py-script>
display("One")
</py-script>
<p>BBB</p>
<py-script>
display("Two")
</py-script>
<p>CCC</p>
<py-script>
display("Up Top", target="verytop")
</py-script>
The output order is then:
Up Top
AAA
One
BBB
Two
CCC
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
- html
- pyodide
- pyscript
- python
评论