Question

我正在尝试操纵div元素。虽然我已经定义了某些属性值，但我似乎无法获得初始值。

问题在于：Fiddle

我在绳子的尽头......谢谢。

Answer 1

问题是你的风格没有在html中定义，而是来自css。在这种情况下，您需要使用getComputedStyle来检索样式信息。做点什么

document.defaultView.getComputedStyle（项目，null）的

而不是item.style。

Answer 2

我认为您必须使用document.styleSheets，找到您的样式表，然后遍历cssRules（IE规则）列表以匹配选择器"#viewbase"然后您可以访问您的样式属性有内联样式，因为那里的样式信息也有一个CSSStyleDeclaration（所以你可以使用element.style.left等）。

Sidenode：getComputedStyle不适用于大多数IE版本。 IE对每个元素都有currentStyle个属性，但它们不是一回事。也许两者的结合也会起作用。

<强>更新

管理获得初始职位，如果你需要，你可以重新分配这些价值观，如果我记得很清楚。

function trigger(e) {

item = this;

if (!e) var e = window.event;
if (e.pageX || e.pageY) {
    x1 = e.pageX;
    y1 = e.pageY;
}
else if (e.clientX || e.clientY) {
    x1 = e.clientX;
    y1 = e.clientY;
}

document.getElementById("ex").innerHTML = x1;
document.getElementById("wye").innerHTML= y1;
// the stylesheet you defined, in a standalone context, it might 
// have another index, (i.e. 0 if it's the only one)
list = document.styleSheets[2].cssRules;

for(var i=0;i<list.length;i++)
    //match #viewbase
    if(list[i].selectorText.toLowerCase() == "#"+item.id)
    { item = list[i];
      break;
     }

document.getElementById("xval").innerHTML = item.style.left;
document.getElementById("yval").innerHTML = item.style.top;

document.getElementById("parseX").innerHTML = parseInt(item.style.left, 10);
document.getElementById("parseY").innerHTML = parseInt(item.style.top, 10);

document.getElementById("debug").innerHTML = 'clicked!';

document.onmouseup = release;
}

另一个版本是使用以下

var styleDef = window.getComputedStyle(item) || item.currentStyle;  
document.getElementById("xval").innerHTML = styleDef.left;
document.getElementById("yval").innerHTML = styleDef.top;

Answer 3

如何使用item.offsetLeft和item.offsetTop。这将包括边距和填充，但您应该能够轻松地补偿这一事实。 Here是一个更新的JSFiddle。

document.getElementById("xval").innerHTML = item.offsetLeft;
document.getElementById("yval").innerHTML = item.offsetTop;

同样，在这种情况下，这些调用分别返回10, 10，而不是您要查找的0, 0。那就是说，这足以让你超越你的问题吗？

无法使用javascript获取HTML CSS元素的初始值

3 个答案: