为什么这个简单的JavaScript代码不起作用

Question

我有以下代码：

function show(){ 
    var a=document.getElementById('somediv').style.display; 
    a="block"; 
} 

上面的代码不能正常工作，它的工作原理，如果我们使用

{ 
    var a=document.getElementById('somediv'); 
    a.style.display="block"; 
} 

什么是错的，上面的代码？

Answer 1

为了理解这一点，您需要了解一些关于javascript分配的知识。

当您使用=运算符时，JavaScript中有两种赋值类型：按值赋值并按引用赋值。虽然有些语言可以让您选择在任何给定时间使用哪种类型的任务，但JavaScript不会给您一个选择。它有一套严格的规则，当它使用每个。

“按值分配”表示将数字3或字符串"none"指定为另一个变量。

“通过引用赋值”意味着指向另一个变量的指针被放置到您的新变量中，并且该对象内容的任何编辑都将反映在这两个位置。

对于像字符串，数字和布尔值等简单类型，JavaScript总是使用按值赋值。对于像数组和对象这样的类型，javascript总是按引用进行分配。这意味着，当你这样做：

var a=document.getElementById('somediv').style.display; 

因为在display属性的值是一个字符串，javascript中会使用分配的值和display属性字符串的值复制到a变量。一旦完成了该副本，a变量与display属性没有任何关联。您可以完全独立地更改display属性和a，因为它们每个都有自己的字符串副本。

所以，当你然后做：

a="block"; 

你只是分配一个新的字符串到a变量，因为它没有任何与以前display财产。

---

在另一方面，当你这样做：

var a=document.getElementById('somediv'); 

你到a分配的对象。而且，JavaScript总是通过引用来分配对象。这意味着a有一个指向somediv对象的指针。没有副本，他们都指向完全相同的对象。所以，对任何引用所做的任何更改实际上都会改变同一个对象。所以，当你这样做：

a.style.display="block"; 

要更改实际的DOM对象。

---

我记住的规则是，分配（按值赋值）时，简单的类型，如数字，字符串和布尔值被复制。像数组和对象这样的复杂类型不会被复制，只有一个指向原始对象的指针被放入新变量（由引用分配）中，因此都指向完全相同的对象。

按值分配非常简单。通过引用进行分配可能既强大又偶尔会引起混淆，从而导致软件中的错误无法预测真正参考原始文件的后果。正因为如此，如果你想要一个对象的实际副本，你必须明确地创建一个对象的副本，因为分配不会为你做。另一方面，只要您了解它的工作原理，就可以引用复杂的对象，这些对象可以传递给用户。在javascript中，没有办法获得像数字，字符串或布尔型这样的简单类型的引用。它可以放入一个对象（作为一个属性），然后你可以传递一个对象的引用，但是你不能将一个引用传递给简单类型。

---

这里有几个例子：

// define person 
var person = {height: 66, hair: "blonde"}; 

// assign the person object to bob 
// because person is an object, the assignment is by reference 
var bob = person; 

// change bob's hair 
bob.hair = "red"; 

// because assignment was by reference, person and bob are the same 
// object so changing one changes the one original 
alert(person.hair); // red 

---

// define person 
var person = {height: 66, hair: "blonde"}; 

// assign the person's height to a variable 
// because height is a number, the assignment is by value (e.g. it's copied) 
var myHeight = person.height; 

// change both heights 
myHeight = 72; 
person.height = 60; 

// because assignment was by value, myHeight and person.height are 
// completely separate copies so changing one does not affect the other 
alert(myHeight);   // 72 
alert(person.height); // 60 

Answer 2

=是一个赋值操作符。你正在放置一个变量内的东西。在第一种情况下，您将a设置为display的值。这是一个字符串，等于block或none等。

在第二种情况下，您将a设置为对象somediv。然后你设置它的显示属性。

第一种情况不起作用，因为您的代码说：设置字符串的显示属性。一个字符串没有显示属性，因此失败。这就像是在说：

'foobar'.style.display = 'none' 

Answer 3

你写的功能失常的咒语。 根据您的代码document.getElementById('somediv').style.display返回div的当前显示状态，所以它给出了设置显示块的错误。

您将直接设置DIV display属性这样

function show(){ 
    var a=document.getElementById('somediv').style.display="block"; 
}