登录(不可用)极客版页面后,自动开启助手插件,显示设备、变量与自动化的关系,方便查找设备或变量用在了哪些自动化中。点击自动化规则名称即可跳转到自动化页面并高亮所对应的设备或变量卡片。支持快捷键折叠/展开,关闭,适应画布布局,设备高亮,日志高亮,自动适应画布、设置自动化列表布局样式等功能。
嗯,刚开始试的MutationObserver监听,页面卡死了,后来就改轮询了。先完成功能,满足刚需,以后看看是否有必要优化~
感谢提供思路,v0.8.9版本已将轮询改为了事件监听机制
QingJ © 2025
镜像随时可能失效,请加Q群300939539或关注我们的公众号极客氢云获取最新地址
高亮可以把循环查询改成callback触发:
const targetNode = document.body;
// 观察器的配置(需要观察哪些变动)
const config = {
childList: true,
subtree: true,
};
// 当观察到变动时执行的回调函数
const callback = function(mutationsList, observer) {
for (let mutation of mutationsList) {
if (mutation.type === 'childList' && mutation.addedNodes.length > 0) {
mutation.addedNodes.forEach(node => {
if (node.nodeType === Node.ELEMENT_NODE) {
// 处理新添加的 .panel-log-card-blink 元素
if (node.classList.contains('panel-log-card-blink')) {
node.style.backgroundColor = 'red'; // 修改背景颜色为红色
node.style.border = '2px solid yellow'; // 修改边框为黄色
} else {
const blinkElement = node.querySelector('.panel-log-card-blink');
if (blinkElement) {
blinkElement.style.backgroundColor = 'red'; // 修改背景颜色为红色
blinkElement.style.border = '2px solid yellow'; // 修改边框为黄色
}
}
// 处理新添加的 元素
if (node.tagName === 'ANIMATE') {
const pathElement = node.parentElement;
if (pathElement) {
pathElement.setAttribute('stroke', 'red');
}
} else {
const animateElements = node.querySelectorAll('animate');
animateElements.forEach(animateElement => {
const pathElement = animateElement.parentElement;
if (pathElement) {
pathElement.setAttribute('stroke', 'red');
}
});
}
}
});
}
}
};
// 创建一个观察器实例并传入回调函数
const observer = new MutationObserver(callback);
// 以上述配置开始观察目标节点
observer.observe(targetNode, config);
// 你可以在适当的时候停止观察
// observer.disconnect();