为什么在向DOM添加文本时使用变量?

时间:2012-12-26 05:33:28

标签: javascript

我是网络开发人员的新手,我一直在做一些我在网上找到的JavaScript练习。其中一个要求提示用户输入名字和姓氏,并将这些名称添加到文档中。

在研究这个时,我发现使用了很多变量的代码。我的解决方案是:

var el = document.getElementById("welcome");
var txt = fullName;
var node = document.createTextNode(txt);
el.appendChild(node);
    };

greet()

我玩了一下,发现这很有效:

document.getElementById("welcome").appendChild(document.createTextNode(fullName));

您可以在jsFiddle看到我原来的解决方案。我还在HTML中添加了说明。

我的问题是为什么大多数人都建议投入变量?这是最佳做法吗?为什么呢?

哦,如果你去那里,有人可以告诉我为什么我的有序清单没有数字吗? jsFiddle是否在他们的CSS上使用重置?

注意:我不确定我是否需要将它放在一个功能中,但是现在,将所有内容放在一个盒子中可以帮助我保持井井有条。

感谢您的帮助 戴夫

5 个答案:

答案 0 :(得分:1)

变量可以为值赋予“名称”。这些名称 - 可以(但不总是)使代码更具自我描述性并且更易于遵循。遗憾的是,示例中的变量名称是良好描述性名称的一个不好的例子,但是......

(考虑一下)

var welcomeElm = document.getElementById("welcome");
var titleElm = document.createTextNode(fullname);
welcomeElm.appendChild(titleElm);
// and maybe also do something else too ..
// (no need to re-evaluate getElementById)
welcomeElm.className = "available";

答案 1 :(得分:1)

如果你需要“document.getElementById(”welcome“)”不止一次,那么

使用变量是很好的做法。

它会缩小您的网页尺寸,从而加快您的网页工作速度。

答案 2 :(得分:1)

并不是你需要在你的代码中使用很多变量,只是你是一个初学者而且作者通常不会使用超级编程技能来教授初学者,因为当你学习时你可以使你的代码更强大,更短,更聪明。因此,如果你在学习期间编写更好的代码,那么你的学习速度似乎要快得多......使用变量来保持价值通常是一种很好的做法......但是如果你足够聪明的话可以让你的工作不用太多它们没有害处......这是一个简单的例子,你实际上并不需要2个变量

var a = 5, b = 5;
var result = a + b;

alert(result); //Results 10 

可以简单地写成

var total = 5 + 5;
alert(total); //Results 10 too

但是再次使用第二种方法时,您可能无法在任何地方使用var total,并且每次需要时都需要自己更改值,因此最好创建足够的变量,以便您更容易修改代码并相应地使用数据

对于另一个问题,是的,jsfiddle会重置CSS

如果您不想重置元素,请取消选中规范化CSS

答案 3 :(得分:1)

变量用于在代码中存储值。如果您使用代码而不将它们存储在变量中,那么您将很难操作数据。在您的代码中,您使用了提示。如果你没有变量,那么如何获得用户输入的值,Javascript中的变量可以帮助我们不要编写大代码并节省我们的时间!

答案 4 :(得分:1)

使用它们的几个原因,虽然我怀疑这里的情况如何。

自文档。

var title = "Program crashed";
var msg = "Program crashed";
do_alert(title, msg);

更容易调试:(代码根据评论略有变化)

var step1 = long_complex_function();
alert(step1);
//console.log(step1);

var step2 = long_other_calcuation;
alert.log(step2);
//console.log(step2);

do_major_func(step1, step2);