Javascript：改变x的值，而x是object.style.left;

这里是我的情况：Javascript：改变x的值，而x是object.style.left;

我有一个CSS位置为`“的div div：10px;” 所有divs位置被设置为固定。现在我把这个值放入一个变量（JS）：

var Left = document.getElementById("div").style.left;

现在我可以提醒它：alert(Left);，我得到一个盒子巫婆说，“10px的” 这里是它的小提琴：http://jsfiddle.net/L19rq2tk/2/

现在我想通过使用变量Left来改变位置的值。我想，来到我的脑海每一种可能性：通过下面的代码更改位置工作

Left = "100px"; -->does not work 
Left = 100px; -->does not work 
Left = "100"; -->does not work 
Left = 100;  -->does not work

：

document.getElementById("div").style.left="100px";

会很高兴，如果有人可以帮助我！

来源

2015-06-20 Daniel Schumann

通过赋值给变量留下什么都不做。您需要将值分配给html元素。

使用

document.getElementById("div").style.left="100px";

左边是一个变种，其仅保持先前值。

你还需要给

positon:relative

到您的DIV否则它不会移动，左，如果元素具有这是在你丢失了一些位置属性只能应用于顶部和其他位置的CSS。

http://jsfiddle.net/L19rq2tk/

这里是你更新的提琴;

来源

2015-06-20 19:06:21

left作品与position:absolute
Here is updated fiddle
更新

通过添加position天气relative or absolute将做的工作。通过添加position:absoute可能对你的设计的副作用（如lonic在评论中提及）
DEMO

来源

2015-06-20 19:08:06 ozil

不，不对。您需要添加'position：relative'或'position：absolute'。不要只使用'position：absoute'，因为它可能会对您的设计产生副作用。 – Ionic

@Ionic为您提供的信息OP's不会询问_Don't只是使用position：absoute，因为它可能会对您的设计产生副作用。所以不要试图结束智能 – ozil

那么如果你建议错误的东西？ OP有他的答案，但这不太正确。如果我问如何节省我的数据库空间，我也可以回答删除所有行。这是正确的，我会再次拥有这个空间，但它有所有我的数据丢失的副作用。 :-P在设计中，“绝对”可能会有更糟的副作用。只需编辑你的文章是正确的，一切都很好。 – Ionic

看到这个fiddle。

您已指定100px，但您尚未添加position:relative或position:absolute。由于这个事实你没有看到任何东西，但它被分配在后台。

来源

2015-06-20 19:10:08 Ionic

注意：通过在你的小提琴中使用'var Left'与'object.style.left'，OP没有将''100px''指定为元素的左边样式。 –

没有你的权利，它没有被指定。它由下一行中的'object.style.left =“100px”'分配。它只是添加显示如何分配继续。而且使用object而不是总是使用'document ....'的时间会更短。 :-) – Ionic

您必须使用您在答案document.getElementById("div").style.left="100px";结尾提到的显式形式。如果你正试图避免每次查找元素，你应该能够做这样的事情：

var savedStyle = document.getElementById("div").style; 
savedStyle.left = '100px';

你不能设置他们的方式你尝试，因为Left存储值的副本中的值它并没有指向相同的价值。当您将Left设置为新值时，您只会更改正在存储的值，而不是object.style.left正在存储的值。虽然可以让多个变量指向相同的对象，但不能让多个变量指向相同的值。我已经包含了一个演示片段，显示了不同之处。

var x = 1; 
 
var y = x; 
 
document.write('x = ' + x + '<br>'); 
 
document.write('y = ' + y + '<br>'); 
 
document.write('Setting y to 2<br>'); 
 
y = 2; 
 
document.write('x is now = ' + x + '<br>'); 
 
document.write('y is now = ' + y + '<br>'); 
 

 
var xObj = { myValue: 3 }; 
 
var yObj = xObj; 
 
document.write('xObj.myValue = ' + xObj.myValue + '<br>'); 
 
document.write('yObj.myValue = ' + yObj.myValue + '<br>'); 
 
document.write('Setting yObj.myValue to 1<br>'); 
 
yObj.myValue = 1; 
 
document.write('xObj.myValue is now = ' + xObj.myValue + '<br>'); 
 
document.write('yObj.myValue is now = ' + yObj.myValue + '<br>');

来源

2015-06-20 19:15:00 rdubya

Javascript：改变x的值，而x是object.style.left;

回答

相关问题