我刚刚开始学习HTML自定义元素,并且通过阅读一系列介绍,教程和文档,我认为我对它的工作方式有很好的了解,但是我对使用或不使用正确方法有一个哲学问题该<template>标签。
自定义元素使您能够封装新功能,简化HTML文档的结构,并允许您简单地插入<my-custom-element>...</my-custom-element>标记而不是<div class="my-custom-element"><span class="part1">...</span><span class="part2">...</span></div>。
然后,元素的类定义将设置该元素的结构和功能。然后,一堆教程描述了如何使用<template>...</template>和<slot>...</slot>设置自定义元素的内容。然后,您必须将模板代码包含在要使用该元素的每个HTML文档中,而不是在自定义元素类的构造函数中进行设置。这是否与自定义元素以使它们更易于移植的方式帮助简化和封装功能这一事实背道而驰?还是我误解了模板在文档中的正确用法和/或位置?
从SO来看,我能找到的最接近解决这个问题的方法是:
但是答案本质上都绕在一起,说“不要使用<template>”,因此并不能真正消除我的困惑。
javascript html5 web-component html5-template custom-element