当引用 HTML 表单中的元素时，我经常使用 name 属性的名称/值。所以，如果表单的名称是“form01”，我指的是表单的书写document.forms.form01。这是一个例子：
let title = document.forms.form01.title;
console.log(title.value);<form name="form01">
<input type="text" name="title" value="Hello World">
</form>这是一个 HTMLCollection，但在DOM 标准 #interface-htmlcollectiondocument.forms的文档中，它没有提到在这样的集合上直接使用名称作为属性（我认为它被称为“命名属性”）的可能性 -就像我用来指代表单元素时一样。相反，文档实际上指出这是“历史文物”——那么，我应该避免使用它吗？document.forms.form01
你能帮我找到这方面的文档吗？要么它是一个可以使用的（好）功能，要么它是应该避免的东西。
<a>当用户与Web组件进行交互时，将创建锚元素（）。问题是，单击锚点后，无法从Web组件的“外部”返回锚点元素。
我添加了一个事件监听器来document监听点击事件。当单击DOM中某处的元素时，我希望成为e.target被单击的元素。在Web组件内部某处单击的情况下，<fancy-list></fancy-list>将返回自定义元素（）-而不是单击的元素。
当影子DOM的模式设置为openDOM时，应该可以访问。
class Fancylist extends HTMLElement {
constructor() {
super();
const shadow = this.attachShadow({ mode: 'open' });
const wrapper = document.createElement('div');
wrapper.innerHTML = `<ul></ul><button>Add item</button>`;
shadow.appendChild(wrapper);
this.on_root_click = this.on_root_click.bind(this);
}
connectedCallback() {
this.ul_elm = this.shadowRoot.querySelector('ul');
this.shadowRoot.addEventListener('click', this.on_root_click, false);
}
on_root_click(e){
switch(e.target.nodeName){
case 'BUTTON':
this.ul_elm.innerHTML += '<li><a href="p1">List item</a></li>';
break;
case 'A':
e.preventDefault();
console.log('You clicked a link!');
break;
}
}
}
customElements.define('fancy-list', Fancylist);
Run Code Online (Sandbox Code Playgroud)
<!DOCTYPE html>
<html>
<head>
<title>List</title>
<meta charset="utf-8" /> …
Run Code Online (Sandbox Code Playgroud)
Run Code Online (Sandbox Code Playgroud)我尝试了这个工具，但我无法加入这些线并使它们成为单一路径我不能加入这些线还是我做错了？这是代码
<svg width="1200" height="800" version="1.1" viewBox="0 0 317.5 211.67" xmlns="http://www.w3.org/2000/svg">
<g fill="none" stroke="#000" stroke-width=".26458px">
<path d="m19.333 167.93-0.12636-2.9063 8.5925-8.5925-0.12636-7.3289 4.6753-4.6753v-17.564l5.4335-5.0544-0.12636-10.235"/>
<path d="m32.348 126.87-2.9063-3.159 0.12636-19.839"/>
</g>
</svg>