Chromium HTML Tags与c++接口对应关系分析

一、HTML 标签(HTML Tags)

<a> <head> <img>等等这些标签在c++中的接口是如何定义和查找的呢?

更多标签参考:

HTML <a> target 属性 (w3school.com.cn)

二、html_tag_names.json5

(third_party\blink\renderer\core\html\html_tag_names.json5)

此文件里面是c++用来生成前端对应HTML Tags。

{
  metadata: {
    namespace: "HTML",
    namespacePrefix: "xhtml",
    namespaceURI: "http://www.w3.org/1999/xhtml",
    fallbackInterfaceName: "HTMLUnknownElement",
    export: "CORE_EXPORT",
  },

  // If you add any tag names here, remember to update html_tree_builder_test.cc.

  // Note that if an element is associated with a feature flag that has an
  // origin trial, you must:
  // * set runtimeFlagHasOriginTrial to true below, which disables the checks
  //   that ensure that the tokenizer produces HTMLTag::kUnknown when the
  //   feature flag is disabled.
  // * make sure that any uses of HTMLTag::kYourElement treat it as
  //   HTMLTag::kUnknown if the feature flag is disabled.  The member is
  //   renamed to HTMLTag::kYourElementOrUnknown to remind you of this.
  // * have a virtual suite testing the feature flag being disabled that
  //   checks that any relevant behaviors (parsing or otherwise) are
  //   unaffected when the feature is disabled.
  // See https://crbug.com/1512345
  data: [
    {
      name: "a",
      interfaceName: "HTMLAnchorElement",
    },
    {
      name: "abbr",
      interfaceName: "HTMLElement",
    },
    {
      name: "acronym",
      interfaceName: "HTMLElement",
    },
    {
      name: "address",
      interfaceName: "HTMLElement",
    },
    {
      name: "applet",
      interfaceName: "HTMLUnknownElement",
    },
    "area",
    {
      name: "article",
      interfaceName: "HTMLElement",
    },
    {
      name: "aside",
      interfaceName: "HTMLElement",
    },
    {
      name: "audio",
      interfaceHeaderDir: "third_party/blink/renderer/core/html/media",
    },
    {
      name: "b",
      interfaceName: "HTMLElement",
    },
    "base",
    {
      name: "basefont",
      interfaceName: "HTMLElement",
    },
    {
      name: "bdi",
      JSInterfaceName: "HTMLElement",
      interfaceName: "HTMLBDIElement",
    },
    {
      name: "bdo",
      interfaceName: "HTMLElement",
    },
    {
      name: "bgsound",
      interfaceName: "HTMLUnknownElement",
    },
    {
      name: "big",
      interfaceName: "HTMLElement",
    },
    {
      name: "blockquote",
      interfaceName: "HTMLQuoteElement",
    },
    "body",
    {
      name: "br",
      interfaceName: "HTMLBRElement",
    },
    {
      name: "button",
      interfaceHeaderDir: "third_party/blink/renderer/core/html/forms",
    },
    {
      name: "canvas",
      interfaceHeaderDir: "third_party/blink/renderer/core/html/canvas",
    },
    {
      name: "caption",
      interfaceName: "HTMLTableCaptionElement",
    },
    {
      name: "center",
      interfaceName: "HTMLElement",
    },
    {
      name: "cite",
      interfaceName: "HTMLElement",
    },
    {
      name: "code",
      interfaceName: "HTMLElement",
    },
    {
      name: "col",
      interfaceName: "HTMLTableColElement",
    },
    {
      name: "colgroup",
      interfaceName: "HTMLTableColElement",
    },
    {
      name: "command",
      interfaceName: "HTMLUnknownElement",
    },
    {
      name: "data",
      interfaceName: "HTMLDataElement",
    },
    {
      name: "datalist",
      interfaceName: "HTMLDataListElement",
      interfaceHeaderDir: "third_party/blink/renderer/core/html/forms",
    },
    {
      name: "dd",
      interfaceName: "HTMLElement",
    },
    {
      name: "del",
      interfaceName: "HTMLModElement",
    },
    "details",
    {
      name: "dfn",
      interfaceName: "HTMLElement",
    },
    {
      name: "dir",
      interfaceName: "HTMLDirectoryElement",
    },
    "dialog",
    "div",
    {
      name: "dl",
      interfaceName: "HTMLDListElement",
    },
    {
      name: "dt",
      interfaceName: "HTMLElement",
    },
    {
      name: "em",
      interfaceName: "HTMLElement",
    },
    {
      name: "embed",
      constructorNeedsCreateElementFlags: true,
    },
    {
      name: "fencedframe",
      interfaceName: "HTMLFencedFrameElement",
      interfaceHeaderDir: "third_party/blink/renderer/core/html/fenced_frame",
      runtimeEnabled: "FencedFrames",
      // Set runtimeFlagHasOriginTrial to disable feature flag checks in
      // the tokenizer (which doesn't necessarily have access to the
      // document)
      runtimeFlagHasOriginTrial: true,
      // This element could be enabled in some documents but not others (due to
      // origin trials), so we need custom type helpers.
      noTypeHelpers: true,
    },
    {
      name: "fieldset",
      interfaceName: "HTMLFieldSetElement",
      interfaceHeaderDir: "third_party/blink/renderer/core/html/forms",
    },
    {
      name: "figcaption",
      interfaceName: "HTMLElement",
    },
    {
      name: "figure",
      interfaceName: "HTMLElement",
    },
    "font",
    {
      name: "footer",
      interfaceName: "HTMLElement",
    },
    {
      name: "form",
      interfaceHeaderDir: "third_party/blink/renderer/core/html/forms",
    },
    "frame",
    {
      name: "frameset",
      interfaceName: "HTMLFrameSetElement",
    },
    {
      name: "h1",
      interfaceName: "HTMLHeadingElement",
    },
    {
      name: "h2",
      interfaceName: "HTMLHeadingElement",
    },
    {
      name: "h3",
      interfaceName: "HTMLHeadingElement",
    },
    {
      name: "h4",
      interfaceName: "HTMLHeadingElement",
    },
    {
      name: "h5",
      interfaceName: "HTMLHeadingElement",
    },
    {
      name: "h6",
      interfaceName: "HTMLHeadingElement",
    },
    "head",
    {
      name: "header",
      interfaceName: "HTMLElement",
    },
    {
      name: "hgroup",
      interfaceName: "HTMLElement",
    },
    {
      name: "hr",
      interfaceName: "HTMLHRElement",
    },
    "html",
    {
      name: "i",
      interfaceName: "HTMLElement",
    },
    {
      name: "iframe",
      interfaceName: "HTMLIFrameElement",
    },
    {
      name: "image",
      interfaceName: "HTMLUnknownElement",
    },
    {
      name: "img",
      constructorNeedsCreateElementFlags: true,
      interfaceName: "HTMLImageElement",
    },
    {
      name: "input",
      constructorNeedsCreateElementFlags: true,
      interfaceHeaderDir: "third_party/blink/renderer/core/html/forms",
    },
    {
      name: "ins",
      interfaceName: "HTMLModElement",
    },
    {
      name: "kbd",
      interfaceName: "HTMLElement",
    },
    {
      name: "keygen",
      interfaceName: "HTMLUnknownElement",
    },
    {
      name: "label",
      interfaceHeaderDir: "third_party/blink/renderer/core/html/forms",
    },
    {
      name: "layer",
      interfaceName: "HTMLElement",
    },
    {
      name: "legend",
      interfaceHeaderDir: "third_party/blink/renderer/core/html/forms",
    },
    {
      name: "li",
      interfaceName: "HTMLLIElement",
    },
    {
      name: "link",
      constructorNeedsCreateElementFlags: true,
    },
    {
      name: "listbox",
      interfaceName: "HTMLListboxElement",
      runtimeEnabled: "HTMLSelectListElement",
      interfaceHeaderDir: "third_party/blink/renderer/core/html/forms",
    },
    {
      name: "listing",
      interfaceName: "HTMLPreElement",
    },
    {
      name: "main",
      interfaceName: "HTMLElement",
    },
    "map",
    {
      name: "mark",
      interfaceName: "HTMLElement",
    },
    "marquee",
    "menu",
    {
      name: "meta",
      constructorNeedsCreateElementFlags: true,
    },
    {
      name: "meter",
      interfaceName: "HTMLMeterElement",
    },
    {
      name: "nav",
      interfaceName: "HTMLElement",
    },
    {
      name: "nobr",
      interfaceName: "HTMLElement",
    },
    {
      name: "noembed",
      JSInterfaceName: "HTMLElement",
      interfaceName: "HTMLNoEmbedElement",
    },
    {
      name: "noframes",
      interfaceName: "HTMLElement",
    },
    {
      name: "nolayer",
      interfaceName: "HTMLElement",
    },
    {
      name: "object",
      constructorNeedsCreateElementFlags: true,
    },
    {
      name: "ol",
      interfaceName: "HTMLOListElement",
    },
    {
      name: "optgroup",
      interfaceName: "HTMLOptGroupElement",
      interfaceHeaderDir: "third_party/blink/renderer/core/html/forms",
    },
    {
      name: "option",
      interfaceHeaderDir: "third_party/blink/renderer/core/html/forms",
    },
    {
      name: "output",
      interfaceHeaderDir: "third_party/blink/renderer/core/html/forms",
    },
    {
      name: "p",
      interfaceName: "HTMLParagraphElement",
    },
    "param",
    {
      name: "permission",
      interfaceName: "HTMLPermissionElement",
      runtimeEnabled: "PermissionElement",
    },
    {
      name: "picture",
      interfaceName: "HTMLPictureElement",
    },
    {
      name: "plaintext",
      interfaceName: "HTMLElement",
    },
    "pre",
    {
      name: "progress",
      interfaceName: "HTMLProgressElement",
    },
    {
      name: "q",
      interfaceName: "HTMLQuoteElement",
    },
    {
      name: "rb",
      interfaceName: "HTMLElement",
    },
    {
      name: "rp",
      interfaceName: "HTMLElement",
    },
    {
      name: "rt",
      JSInterfaceName: "HTMLElement",
      interfaceName: "HTMLRTElement",
    },
    {
      name: "rtc",
      interfaceName: "HTMLElement",
    },
    {
      name: "ruby",
      JSInterfaceName: "HTMLElement",
      interfaceName: "HTMLRubyElement",
    },
    {
      name: "s",
      interfaceName: "HTMLElement",
    },
    {
      name: "samp",
      interfaceName: "HTMLElement",
    },
    {
      name: "script",
      constructorNeedsCreateElementFlags: true,
    },
    {
      name: "search",
      interfaceName: "HTMLElement",
      runtimeEnabled: "HTMLSearchElement",
    },
    {
      name: "section",
      interfaceName: "HTMLElement",
    },
    {
      name: "select",
      interfaceHeaderDir: "third_party/blink/renderer/core/html/forms",
    },
    {
      name: "selectedoption",
      interfaceName: "HTMLElement",
      runtimeEnabled: "HTMLSelectListElement",
    },
    {
      name: "selectlist",
      interfaceName: "HTMLSelectListElement",
      runtimeEnabled: "HTMLSelectListElement",
      interfaceHeaderDir: "third_party/blink/renderer/core/html/forms",
    },
    {
      name: "slot",
      interfaceName: "HTMLSlotElement",
    },
    {
      name: "small",
      interfaceName: "HTMLElement",
    },
    "source",
    "span",
    {
      name: "strike",
      interfaceName: "HTMLElement",
    },
    {
      name: "strong",
      interfaceName: "HTMLElement",
    },
    {
      name: "style",
      constructorNeedsCreateElementFlags: true,
    },
    {
      name: "sub",
      interfaceName: "HTMLElement",
    },
    {
      name: "summary",
      JSInterfaceName: "HTMLElement",
      interfaceName: "HTMLSummaryElement",
    },
    {
      name: "sup",
      interfaceName: "HTMLElement",
    },
    "table",
    {
      name: "tbody",
      interfaceName: "HTMLTableSectionElement",
    },
    {
      name: "td",
      interfaceName: "HTMLTableCellElement",
    },
    "template",
    {
      name: "textarea",
      interfaceName: "HTMLTextAreaElement",
      interfaceHeaderDir: "third_party/blink/renderer/core/html/forms",
    },
    {
      name: "tfoot",
      interfaceName: "HTMLTableSectionElement",
    },
    {
      name: "th",
      interfaceName: "HTMLTableCellElement",
    },
    {
      name: "thead",
      interfaceName: "HTMLTableSectionElement",
    },
    {
      name: "time",
      interfaceName: "HTMLTimeElement",
    },
    "title",
    {
      name: "tr",
      interfaceName: "HTMLTableRowElement",
    },
    {
      name: "track",
      interfaceHeaderDir: "third_party/blink/renderer/core/html/track",
    },
    {
      name: "tt",
      interfaceName: "HTMLElement",
    },
    {
      name: "u",
      interfaceName: "HTMLElement",
    },
    {
      name: "ul",
      interfaceName: "HTMLUListElement",
    },
    {
      name: "var",
      interfaceName: "HTMLElement",
    },
    {
      name: "video",
      interfaceHeaderDir: "third_party/blink/renderer/core/html/media",
    },
    {
      name: "wbr",
      JSInterfaceName: "HTMLElement",
      interfaceName: "HTMLWBRElement",
    },
    {
      name: "xmp",
      interfaceName: "HTMLPreElement",
    },
    {
      name: "noscript",
      JSInterfaceName: "HTMLElement",
      interfaceName: "HTMLNoScriptElement",
    },
  ],
}

三、接下来以以<a>  <head>标签定义看下html_tag_names.json5中如何定义的

3.1、<a> 对应    {
      name: "a",
      interfaceName: "HTMLAnchorElement",
    },

<head>对应   

"head",
    {
      name: "header",
      interfaceName: "HTMLElement",
    },

其中<a> == "a" 接口定义 interfaceName: "HTMLAnchorElement", 其他的也类似。

3.2、interfaceName: "HTMLAnchorElement" 名字直接对应的HTMLAnchorElement.idl(c++接口定义)

   2.1)、规则interfaceName+.idl,

   2.2)、还有根据interfaceHeaderDir定义的接口   {
      name: "input",
      constructorNeedsCreateElementFlags: true,
      interfaceHeaderDir: "third_party/blink/renderer/core/html/forms",
    },

  2.3)、还有 "body",这样的无name的

  搜索规则: html_"tag"_element.idl  html_"tag"_element.h html_"tag"_element.cc

  看例子:

"body"  html_body_element.idl    html_body_element.h    html_body_element.cc

 "details", html_details_element.idl html_details_element.h html_details_element.cc

3.3、根据HTMLAnchorElement.idl即可找到blink的c++实现

third_party\blink\renderer\core\html\html_anchor_element.h

third_party\blink\renderer\core\html\html_anchor_element.cc

3.4、接口HTMLAnchorElement.idl在v8下实现规则:

规则 v8_ + html_anchor_element.cc

out\Debug\gen\third_party\blink\renderer\bindings\core\v8\v8_html_anchor_element.h

out\Debug\gen\third_party\blink\renderer\bindings\core\v8\v8_html_anchor_element.cc

四、总结:

查找html_tag定义只需在third_party\blink\renderer\core\html\html_tag_names.json5文件中输入对对应标签,即可找到interfaceName定义。又可以根据interfaceName定义的文件名找到blink和v8定义。

   

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/892205.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

基于SpringBoot的体育商城购物系统

作者&#xff1a;计算机学姐 开发技术&#xff1a;SpringBoot、SSM、Vue、MySQL、JSP、ElementUI、Python、小程序等&#xff0c;“文末源码”。 专栏推荐&#xff1a;前后端分离项目源码、SpringBoot项目源码、Vue项目源码、SSM项目源码、微信小程序源码 精品专栏&#xff1a;…

【AI大模型】初识LangChain:功能强大的语言模型框架

目录 &#x1f354; 什么是LangChain &#x1f354; LangChain主要组件 2.1 Models 2.1.1 LLMs (大语言模型) 2.1.2 Chat Models (聊天模型) 2.1.3 提示模板 2.1.4 Embeddings Models(嵌入模型) 2.2 Prompts 2.3 Chains(链) 2.4 Agents (代理) 2.5 Memory 2.6 Inde…

爬虫post收尾以及cookie加代理

爬虫post收尾以及cookie加代理 目录 1.post请求收尾 2.cookie加代理 post收尾 post请求传参有两种格式&#xff0c;载荷中有请求载荷和表单参数&#xff0c;我们需要做不同的处理。 1.表单数据&#xff1a;data字典传参 content-type: application/x-www-form-urlencoded; …

鸿蒙开发案例:HarmonyOS NEXT语法实现2048

【实现的功能】 • 游戏逻辑&#xff1a;实现了2048游戏的核心逻辑&#xff0c;包括初始化游戏盘面、添加随机方块、处理四个方向的滑动操作等。 • UI展示&#xff1a;构建了游戏的用户界面&#xff0c;显示得分、游戏盘面&#xff0c;并提供了重新开始按钮。 • 用户交互&…

【Docker基础六】docker-compose安装zookeeper、kafka、kafdrop

本文使用 Bitnami/Kafka 提供的kafka容器镜像。详情参考&#xff1a;bitnami/kafka - Docker 镜像 |Docker 中心 创建Docker Compose文件 创建一个名为 docker-compose.yml 的文件&#xff0c;并复制以下内容 version: "3.8" services:zookeeper:image: docker.io…

【C语言】赋值运算符自增、自减

C语言中用来表示赋值&#xff0c;将符号右边的常量或变量的值&#xff0c;赋值给左边的变量。 等号用来表示&#xff0c;一般用于判断条件&#xff0c;属于关系运算的一种&#xff0c;所以会有返回值&#xff0c;1或0。 #include <stdio.h> /* 功能&#xff1a;赋值运算…

微信小程序后台搭建—node+mysql

想必大家都有一个困扰&#xff0c;想要用微信小程序作为前端&#xff0c;但是后端不知道如何用node连接微信小程序&#xff0c;我最近也一直困扰许久&#xff0c;所以我就想用node写后端接口在连接微信小程序&#xff0c;记录一下学习笔记 前言 前端:微信小程序 后端:nodeexpr…

QT QML 练习8-Simple Transformations

简单的转换&#xff08;Simple Transformations&#xff09; 转换操作改变了一个对象的几何状态。QML元素对象通常能够被平移&#xff0c;旋转&#xff0c;缩放。下面我们将讲解这些简单的操作和一些更高级的用法。 我们先从一个简单的转换开始。用下面的场景作为我们学习的开始…

去掉CODESYS的用户管理密码

首先在成功连接PLC的情况下&#xff08;CODESYS登录成功&#xff09;情况下&#xff1a; 1. 2. 3. 4.CODESYS自动化应用进阶&#xff08;二&#xff09;&#xff1a;如何安装使用CODESYS RTE及使用CODESYS RTE过程中常见的问题_哔哩哔哩_bilibili 视频在00&#xff1a;57&…

基于Spring Boot的企业客户管理系统

目录 前言 功能设计 系统实现 获取源码 博主主页&#xff1a;百成Java 往期系列&#xff1a;Spring Boot、SSM、JavaWeb、python、小程序 前言 本论文主要论述了如何使用JAVA语言开发一个企业客户管理系统&#xff0c;本系统将严格按照软件开发流程进行各个阶段的工作&am…

仿 Mac 个人网站开发 |项目复盘

一、前言 1.1 灵感来源 早年有幸看到国外大佬做的一个 基于 Web 的 Windows XP 桌面娱乐系统, 那时刚好有搭建一个个人博客的想法, 所以就想是否可以基于 WEB 实现一个仿 Mac UI 的个人博客, 以应用的形式来展示博客各个功能! 1.2 相关链接(求个 Star) 前端开源代码后端开源…

OpenAI 实时语音Realtime API接口申请: 助力开发者打造快速语音对话体验

OpenAI发布宣布推出Realtime API的公开测试版&#xff0c;所有付费开发者都可以在他们的应用中构建快速的语音对话体验。该API支持六种预设语音&#xff0c;类似于ChatGPT的高级语音模式&#xff0c;使自然的语音对话成为可能。 此外&#xff0c;Chat Completions API也新增了音…

【微服务】springboot远程docker进行debug调试使用详解

目录 一、前言 二、线上问题常用解决方案 2.1 微服务线上运行中常见的问题 2.2 微服务线上问题解决方案 2.3 远程debug概述 2.3.1 远程debug原理 2.3.2 远程debug优势 三、实验环境准备 3.1 搭建springboot工程 3.1.1 工程结构 3.1.2 引入基础依赖 3.1.3 添加配置文…

linux下使用mpi求自然数和

搭建MPI并行计算环境&#xff0c;编写 MPI程序&#xff0c;求和 1 23....1 0000。 要求: 1.使用100个进程; 2.进程0计算1 2...100, 进程1计算101 102... 200, ..... 进程99计算9901 9902... 10000; 3.调用计时函数,分别输出每个进程的计算时间; 4.需使用MPI集群通信函数和同…

【数据结构】时间、空间复杂度详解

大家有没有遇到过&#xff0c;为什么有些程序跑得飞快&#xff0c;而有些程序却慢得让人抓狂&#xff1f;我们可能都是这样认为的&#xff1a;他写的程序效率高等等&#xff0c;确实如此。但这背后隐藏着两个重要的概念&#xff1a;时间复杂度和空间复杂度。它们就像程序的“效…

MySQL的多表查询之联合查询

union联合查询 union用于合并两个或多个select语句的结果集 unnion将两个表上下拼在一起 要求&#xff1a; –两边select语句的字段数必须一致 –两边可以有不同数据类型的字段 –字段名默认按左边的表来设置 select column_name from table1 union select column_name from …

【Kubernets】配置类型资源 Etcd, Secret, ConfigMap

文章目录 所有资源概览Etcd详细说明一、基本概念二、主要功能三、架构与组件四、数据模型与操作五、安全与认证六、集群部署与管理 Secret详细说明一、Secret 的类型二、Secret 的创建三、Secret 的使用四、Secret 的更新与删除五、Secret 的安全性 ConfigMap详细说明一、Confi…

【分布式训练(5)】无法 kill PID?如何 kill 休眠中的 GPU 占用进程

【分布式训练 debug】VS Code Debug 技巧&#xff1a;launch.json实用参数 【分布式训练&#xff08;2&#xff09;】深入理解 DeepSpeed 的 ZeRO 内存优化策略 (三阶段的区别) 【分布式训练&#xff08;3&#xff09;】accelerator deepspeed debug 报错 “Timed out waiting…

华为OD机试 - 最大利润 - 贪心算法(Python/JS/C/C++ 2024 E卷 100分)

华为OD机试 2024E卷题库疯狂收录中&#xff0c;刷题点这里 专栏导读 本专栏收录于《华为OD机试真题&#xff08;Python/JS/C/C&#xff09;》。 刷的越多&#xff0c;抽中的概率越大&#xff0c;私信哪吒&#xff0c;备注华为OD&#xff0c;加入华为OD刷题交流群&#xff0c;…

光伏仿真系统的好处

现在的做光伏电站的项目&#xff0c;很多任务都是后置的&#xff0c;这样的话问题的暴露就会在每个时间段&#xff0c;光伏仿真系统的好处&#xff0c;就是在做每一步工作前&#xff0c;系统已经把每一步的工作都分配好了&#xff0c;有任何问题都可以提前知道&#xff0c; 获…