Javascript HTML中的新标记和解析器
我草拟了一种新的客户端脚本编程语言。我熟悉如何构建一种语言,以及其中的大部分工作。我准备了一个很长的项目,但对于如何将其实现为HTML文件,我有一些问题。我想在HTML中实现一些类似于标记的东西,并且我找到了一些链接来解释如何在HTML中添加新标记。我认为开发人员必须使用HTML文件头部的语言解析器(它实际上不仅仅是一个解析器,但这不是重点)连接到js文件,就像这样:Javascript HTML中的新标记和解析器,javascript,python,html,html-parsing,Javascript,Python,Html,Html Parsing,我草拟了一种新的客户端脚本编程语言。我熟悉如何构建一种语言,以及其中的大部分工作。我准备了一个很长的项目,但对于如何将其实现为HTML文件,我有一些问题。我想在HTML中实现一些类似于标记的东西,并且我找到了一些链接来解释如何在HTML中添加新标记。我认为开发人员必须使用HTML文件头部的语言解析器(它实际上不仅仅是一个解析器,但这不是重点)连接到js文件,就像这样:。以下是我找到的一些链接: 以下是我的一些问题,假设我想在标签之间使用我的语言: 如何防止浏览器的HTML解析器将标记中的内容误
。以下是我找到的一些链接:
以下是我的一些问题,假设我想在标签之间使用我的语言:
createdCallback()
函数。假设以后没有人使用JavaScript添加标记(对于这种语言来说,这是毫无意义的),则应该在使用自定义标记时调用回调<!DOCTYPE html>
<html>
<head><script src="my-lang.js"></script></head>
<my-language>
//do some stuff in my language, like DOM editing.
//Just a replacement for JavaScript basically that doesn't serve much purpose.
</my-language>
</html>
//用我的语言做一些事情,比如DOM编辑。
//只是JavaScript的替代品,基本上没有多大用处。
如有任何建议,将不胜感激。提前谢谢 与其在HTML中使用新的非标准标记,我建议考虑使用
标记。虽然
标记通常用于Javascript,但情况并非总是如此。例如,服务器为客户端的JS发送数据以进行解析的一种可能技术是将JSON放在一个标签中,如{“foo”:“bar”}
。类型不是type=“javascript”
的脚本将不会被解析为javascript,但是可以使用javascript检索标记内的数据。您可以通过选择标记,然后访问其textContent
属性来实现这一点。(只有当您有意检索HTML标记时,innerHTML
属性才可能适用-否则,最好使用textContent
)
您可以使用几乎相同的技术,但不要使用JSON。解析
标记的内容,通过解析器发送它
例如:
const tag=document.querySelector('script[type=“myNewLanguage”]”);
const scriptText=tag.textContent;
//使用解析器解析脚本文本
scriptText.split('\n').forEach(行=>{
控制台日志(行);
});代码>
foo
酒吧
baz
最好的方法是使用带有自定义语言定义的脚本元素,因此基本上handlerbars、主干和其他库使用脚本标记来保存模板。是否要详细说明?我正在寻找script元素的功能,因此如果这是一个选项,我希望听到更多关于它的信息。也许留下一个答案,描述一下你在说什么。同样,我认为它在语义上很好,因为这就是脚本标签的作用。正如新的答案所说,新的脚本类型将是一种方式。但是我会使用类似“text/myLanguage”的东西,因为这是一个有效的mime类型哇!谢谢你的快速回复。那么最上面的代码片段将是一个单独的文件?我试图让尽可能多的内部工作远离HTML文件,并使使用HTML编码的人易于实现。出于好奇,我可以使用上面提到的链接来定义一个基本上可以归结为您所放置内容的标记吗?谢谢如果您想从HTML中删除自定义语言,您必须发出网络请求来访问代码,这意味着在代码执行之前会有更多的延迟。这是一个非常好的选择,这只是一个你必须考虑的权衡。我不建议在你的链接中使用自定义元素,因为它们的支持太零散了——这是一种新技术,很多老浏览器都不支持。看起来自定义元素也应该用来包含HTML标记,这不是您要做的。太好了,谢谢您的建议。我一定会实施这个。我还计划使用与服务器端语言相同的语法,内置对Node.js的Express和Python的Flask的支持。在动态提供文件时,当在Node.js中使用Express或在Python中使用Flask时,是否有方法将
插入到它们的HTML中?通过这种方式,我的语言几乎可以在HTML中自动得到支持。我不知道这是否应该是一个单独的问题,但我想我会问你。我不知道Flask/Express,但我非常确定非Javascript、非图像资源不能单独从HTML自动加载(就像使用src
属性)-非常确定Javascript网络请求是唯一可以完成的方式。(除非您想链接到包含自定义代码的Javascript文件,例如包含window.myCustomScript=``;
-但这很奇怪)