javascript - 根据 shadowroot 中元素的 ID 获取标签
问题描述
我有下面的 html,我在一个发光的组件中呈现:
render() {
return html`
<div class="table">
<div id="col">
<p>testing this component</p>
</div>
</div>`
通过以下构造函数,我正在调用调整大小处理程序:
constructor() {
super();
window.addEventListener('resize', this._handleResize);
}
handleresize 方法如下:
private _handleResize = () =>{
var some_id = document.getElementById('col');
var tag = some_id.tagName; ///some_id is coming out as null
}
我正在尝试获取'col' ID 的标签,但它让我为空。有人可以告诉这里的错误是什么吗?
解决方案
您应该使用参考,而不是查询元素:
import {ref} from 'lit/directives/ref.js';
[...]
colRef = createRef();
[...]
render() {
return html`
<div class="table">
<div id="col" ${ref(this.colRef)}>
<p>testing this component</p>
</div>
</div>`
}
private _handleResize = () =>{
const col = this.colRef.value!;
const tag = col.tagName;
}
我还建议使用const
andlet
而不是 var。此外,您可能应该ResizeObserver
在window
. 也不要忘记注销您的事件监听器。
推荐阅读
- php - 如何在 laravel 视图刀片中显示来自数据库列的 Json 编码数据
- php - PHP字符串比较问题
- c# - 将数据库服务器移动到 Azure 时,除了连接字符串之外,sql 连接还有哪些变化?
- angular - 使用 Ionic 的低质量 OL 地图
- azure - 如何使用 Azure Active Directory 为外部应用程序设置客户端凭据流
- excel - 如何使用代码在信任中心启用宏设置
- oracle - 如何在 Oracle 和 SQL Server 中的 case 表达式的结果中使用数学表达式
- r - 如何重新排列数据框?
- logstash - 安装 logstash ubuntu 后 /etc/init.d 中缺少 Logstash 文件
- spring - onPartitionsRevokedBeforeCommit 与 onPartitionsRevokedAfterCommit