我编写了根据表单中的用户输入创建框的代码。我使用构造函数为框提供这些值;名称、颜色、ID 和编号。我应该这样做,以便当用户单击页面中的框时,会出现一个警告框,说明该单个框的这些值是什么。我无法弄清楚如何正确显示其中大部分属性。
这是我为框分配属性值并将它们添加到页面的函数:
function addBox(newbox) {
for (var i = 0; i < newbox.number; i++) {
counter++;
var scene = document.getElementById("scene");
var div = document.createElement("div");
div.setAttribute("id", counter);
div.className += " " + "box";
div.innerHTML += newbox.name;
div.style.backgroundColor = newbox.color;
var x = Math.floor(Math.random() * (scene.offsetWidth-101));
var y = Math.floor(Math.random() * (scene.offsetHeight-101));
div.style.left = x + "px";
div.style.top = y + "px";
scene.appendChild(div);
div.onclick = display;
}
}
这是我用于显示有关盒子的信息的功能:
function display(e) {
var a = e.target.attributes;
var b = e.target;
console.log(b.name); //shows "undefined"
alert("id:" + "" + a[0].value);
}
我的警报消息工作正常,它根据计数器的值显示每个框的单独编号。我不明白为什么我无法让 e.target 显示名称、颜色或数字。我是初学者,因此非常感谢任何想法。
最佳答案
您需要对您设置的属性使用.getAttribute()
。
function display(e) {
var element = e.target || window.event.target;
console.log(element.getAttribute('name'));
}
关于javascript - 显示具有事件目标的对象的属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14450508/