Question

我一直试图绕过Javascript，一直在寻找一种方法将它变成一个只影响当前正在盘旋的DOM元素（我也用javascript通过createElement创建）的函数。我尝试了.target和currentTarget的东西，没有用。如果有人能像我指向正确的方向那样做，我将永远感激不尽！

/* This first function is the experimental one, I tried this but to no avail */
function displayTooltip1(tt) {
    var x = tt.currentTarget;
    x.style.cssText = "width: 100px; height: 100px; display: inline-block; margin: 0;1.5px 0 1.5px; overflow: visible;"
}

function displayTooltip2() {
    document.getElementById('image2').style.cssText = "width: 100px; height: 100px; display: inline-block; margin: 0 1.5px 0 1.5px; overflow: visible;";
}

function displayTooltip3() {
    document.getElementById('image3').style.cssText = "width: 100px; height: 100px; display: inline-block; margin: 0 1.5px 0 1.5px; overflow: visible;";
}

Answer 1

只需传递组件的id并按该id获取组件。

使用如下：

function displayTooltip(componentId) {
    document.getElementById(componentId).style.cssText = "width: 100px; 
    height: 100px; display: inline-block; margin: 0 1.5px 0 1.5px; overflow: visible;";
    }

Answer 2

正如我所看到的，所有函数都执行相同的操作，但是使用不同的元素，因此您可以创建一个函数，它将接受元素的ID并使用该元素更改样式：

function displayTooltip(id){
    document.getElementById(id).style.cssText = "width: 100px; 
    height: 100px; display: inline-block; margin: 0 1.5px 0 1.5px; overflow: visible;";
}

displayTooltip(tt);
displayTooltip('image2');
displayTooltip('image3');

如何将这些类似的功能合并为一个

2 个答案: