ABAP的语法高亮是怎么在浏览器里显示的-创新互联

本篇内容介绍了“ABAP的语法高亮是怎么在浏览器里显示的”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!

白朗网站制作公司哪家好,找创新互联!从网页设计、网站建设、微信开发、APP开发、响应式网站设计等网站项目制作,到程序开发,运营维护。创新互联2013年开创至今到现在10年的时间,我们拥有了丰富的建站经验和运维经验,来保证我们的工作的顺利进行。专注于网站建设就选创新互联

在S/4HANA里,我们现在能在浏览器里写ABAP了,并且支持语法高亮。

<br font-size:16px;white-space:normal;background-color:#FFFFFF;" />

ABAP的语法高亮是怎么在浏览器里显示的

你也许会问,ABAP的语法高亮是如何在浏览器里显示的?下面跟我一起来通过调试的方式自己找到问题的答案。

(1). 在浏览器里敲个ABAP的关键字,比如data。发现被高亮了。通过Chrome开发工具发现高亮是通过一个叫ace_keyword的css类实现的。

ABAP的语法高亮是怎么在浏览器里显示的

在Chrome开发工具里以关键字".ace_keyword"搜索: 发现这个css类是硬编码在theme-sap-cumulus.js里的。

ABAP的语法高亮是怎么在浏览器里显示的

(2). 现在需要找到浏览器里进行ABAP代码编辑的编辑器的实现。在Chrome开发工具里Network tab里输入“.xml”作为过滤条件,于是找到编辑器的Fiori实现: Editor.view.xml

ABAP的语法高亮是怎么在浏览器里显示的

具体的编辑器是实现在命名空间reuse的ABAPWrapper标签里。

ABAP的语法高亮是怎么在浏览器里显示的

根据这个命名空间找到实现ABAP编辑器的UI5应用,如下图: nw_aps_ext_lib.

ABAP的语法高亮是怎么在浏览器里显示的

ABAP的语法高亮是怎么在浏览器里显示的

打开ABAPWrapper-dbg.js, 在第68行设置断点。这个函数负责从ABAP后台取PAD文件,该文件和语法高亮有关。

ABAP的语法高亮是怎么在浏览器里显示的

刷新ABAP编辑器页面,断点触发,在调试器里观察PAD文件的内容:

ABAP的语法高亮是怎么在浏览器里显示的

所有的ABAP关键字都列在该PAD文件里,这样UI5就知道编辑器里哪些字符串应该做高亮显示。

ABAP的语法高亮是怎么在浏览器里显示的

ABAP的语法高亮是怎么在浏览器里显示的

(3). 最后一个问题就是,比如当我敲了一个ABAP关键字"new"之后,UI5应用具体哪行代码将对应的css类加到这个字符串对应的DOM节点上?

如下图,一旦我敲了一个字符w之后,字符串new作为一个关键字需要被高亮:

ABAP的语法高亮是怎么在浏览器里显示的

具体逻辑如下图:一旦敲入字符"w"后,onInput作为事件处理函数触发:

ABAP的语法高亮是怎么在浏览器里显示的

函数$renderLine负责生成对应的HTML源代码。输入字符"new"被传入函数getLineTokens来计算该字符串是关键字还是普通变量。

ABAP的语法高亮是怎么在浏览器里显示的

在文件AceRndTokenizer.js里, ABAP解析器按照我们期望的将“new”解析成关键字,因为解析器拥有PAD文件的引用,因此它知道哪些字符串是关键字,哪些是普通变量。

ABAP的语法高亮是怎么在浏览器里显示的

(4). DOM节点的源代码在此处生成,"ace"和“keyword"做连接操作,生成最后我们在Chrome开发工具里看到的完整css类ace_keyword.

ABAP的语法高亮是怎么在浏览器里显示的

ABAP的语法高亮是怎么在浏览器里显示的

“ABAP的语法高亮是怎么在浏览器里显示的”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识可以关注创新互联-成都网站建设公司网站,小编将为大家输出更多高质量的实用文章!

文章标题:ABAP的语法高亮是怎么在浏览器里显示的-创新互联
本文路径:https://www.cdcxhl.com/article18/dedhdp.html

成都网站建设公司_创新互联,为您提供网站策划网页设计公司外贸建站软件开发用户体验商城网站

广告

声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联

小程序开发