javascript权威指南 学习笔记之变量作用域分享
发布网友
发布时间：2022-04-27 03:29
共2个回答
懂视网
时间：2022-05-13 23:34
认识DOM
文档对象模型DOM（Document Object Model）定义访问和处理HTML文档的标准方法。DOM 将HTML文档呈现为带有元素、属性和文本的树结构（节点树）。
先来看看下面代码:
将HTML代码分解为DOM节点层次图:
HTML文档可以说由节点构成的集合，三种常见的DOM节点:
1. 元素节点：上图中、
、等都是元素节点，即标签。
2. 文本节点:向用户展示的内容，如
3. 属性节点:元素属性，如标签的链接属性href="http://www.imooc.com"。
看下面代码:
JavaScript DOM
通过ID获取元素
学过HTML/CSS样式，都知道，网页由标签将信息组织起来，而标签的id属性值是唯一的，就像是每人有一个身份证号一样，只要通过身份证号就可以找到相对应的人。那么在网页中，我们通过id先找到标签，然后进行操作。
语法:
document.getElementById(“id”)
看看下面代码:
结果:null或[object HTMLParagraphElement]
注:获取的元素是一个对象，如想对元素进行操作，我们要通过它的属性或方法。
innerHTML 属性
innerHTML 属性用于获取或替换 HTML 元素的内容。
语法:
Object.innerHTML
注意:
1.Object是获取的元素对象，如通过document.getElementById("ID")获取的元素。
2.注意书写，innerHTML区分大小写。
我们通过id="con"获取
元素，并将元素的内容输出和改变元素内容，代码如下:
结果:
改变 HTML 样式
HTML DOM 允许 JavaScript 改变 HTML 元素的样式。如何改变 HTML 元素的样式呢？
语法:
Object.style.property=new style;
注意:Object是获取的元素对象，如通过document.getElementById("id")获取的元素。
基本属性表（property）:
注意:该表只是一小部分CSS样式属性，其它样式也可以通过该方法设置和修改。
看看下面的代码:
改变
元素的样式，将颜色改为红色，字号改为20,背景颜色改为蓝：
Hello World!
结果:
显示和隐藏（display属性）
网页中经常会看到显示和隐藏的效果，可通过display属性来设置。
语法：
Object.style.display = value
注意:Object是获取的元素对象，如通过document.getElementById("id")获取的元素。
value取值:
看看下面代码:
控制类名（className 属性）
className 属性设置或返回元素的class 属性。
语法：
object.className = classname
作用:
1.获取元素的class 属性
- 为网页内的某个元素指定一个css样式来更改该元素的外观
看看下面代码，获得
元素的 class 属性和改变className：
结果:
我的公众号二维码
热心网友
时间：2022-05-13 20:42
我的理解如下：
“声明”变量，只是仅仅声明，而“定义”变量，指声明了，并且赋值了。
例如:
复制代码
代码如下:
var
name;//只是声明
var
num
=
11;//声明，并且赋值，即定义了
var
password
=
"yangjiang";//声明，并且赋值，即定义了
下面是几点总结：
变量的作用域：全局的和局部的。（注意：如果尝试读取一个未声明的变量的值，javascript会生成一个错误）
第一点：在都使用var关键字修饰变量的情况下，如果给一个局部变量或函数的参数声明的名字与某个全局变量的名字相同，
那么就有效地隐藏了这个全局变量。
例如：
复制代码
代码如下:
var
scope1
=
"global";//var修饰
function
checksScope(){
var
scope1
=
"local";//var修饰
document.write(scope1);
}checksScope();//local
第二点：如果尝试给一个未用
var
关键字声明的变量，那么，隐式声明的变量总是被创建为全局变量，即使
该变量只在一个函数体内使用（只有该函数运行了，才会发生作用）,注意不支持函数嵌套的情形。
例如：
复制代码
代码如下:
scope2
=
"globalAAAAA";//没有使用var修饰(js会默认将其声明为全局变量)
function
checkScopeA(){
scope2
=
"localAAAAA";//没有使用var修饰(js会默认将其声明为全局变量)
document.write("<br/>"+scope2);
myscope
=
"myLocalAAAAA";//没有使用var修饰(js会默认将其声明为全局变量)
document.write(","+myscope);
}
checkScopeA();//localAAAAA，myLocalAAAAA
*A
document.write("<br/>"+scope2);//localAAAAA
*B
document.write("<br/>"+myscope);//myLocalAAAAA
*C
如果将上面的例子中的
*A处的代码注释掉，
例如：
复制代码
代码如下:
scope2
=
"globalAAAAA";//没有使用var修饰(js会默认将其声明为全局变量)
function
checkScopeA(){
scope2
=
"localAAAAA";//没有使用var修饰(js会默认将其声明为全局变量)
document.write("<br/>"+scope2);
myscope
=
"myLocalAAAAA";//没有使用var修饰(js会默认将其声明为全局变量)
document.write(","+myscope);
}
//checkScopeA();
*A
document.write("<br/>"+scope2);//globalAAAAA
*B
document.write("<br/>"+myscope);//发生错误
*C
因为函数checkScopeA没有执行，所以
*B处输出为globalAAAAA;
因为函数checkScopeA没有执行，所以变量myscope没有声明，如果尝试读取一个未声明的变量，会发生错误。
第三点：
在javascript中，函数的定义是可以嵌套的。由于
每个函数都有它自己的局部作用域，所以有可能出现几个局部作用域的嵌套层。
例如：
复制代码
代码如下:
var
scope3
=
"global
scope";
//定义了一个全局变量
function
checkScopeB(){
var
scope3
=
"local
scope";
//定义了一个局部变量，覆盖了全局变量scope3
function
nested(){
var
scope3
=
"nested
scope";
//在函数的函数的内部，定义了一个局部变量
document.write("<br/>"+scope3);
//nested
scope
}
nested();
}
checkScopeB();//nested
scope
第四点：
在javascript中，没有块级作用域，函数中声明的所有变量，无论是在哪里声明的，在整个函数中它们都是有声明的。
在javascript中，没有块级作用域，函数中定义的所有变量，无论是在哪里定义的，在整个函数中它们都是有定义的。
例如：
复制代码
代码如下:
function
test(o){//根据以上的说明：此函数中的i,j,k三个变量的作用域是相同的。
var
i
=
0;
//变量
i
在整个函数中都有定义
if(typeof
o
==
"object"){
var
j
=
0
;
//变量
j
在整个函数中都有定义，而不仅仅是在
if
语句块
for(var
k=0;k<10;k++){//变量
k
在整个函数中都有定义，而不仅仅是在
if
语句块
document.write("<br/>k的值为："+k);
}
document.write("<br/>for循环外k的值："+k);//此时的
k
仍然被定义了，k=10
}
document.write("<br/>j的值:"+j);
//变量
j
被声明了，但可能没有被初始化
因为可能往函数中
传入的参数
不是对象
，if语句块不会执行
}
下面通过两种方式调用此函数：
方式一：传入对象
test({});//输出结果：上例中的注释
方式二：什么都不传
test();//输出结果：j的值：undefined
想不明白的是,在第二种方式中的输出结果,为什么会是
undefined。我当时猜的是：j的值：0
后来，这本书上面说：
由于局部变量在整个函数体内都是有声明（或定义）的，这就意味着在整个函数体中都隐藏了同名的全局
变量。虽然
局部变量在整个函数体内中都是有声明（或定义）的，但是在执行var语句之前，它是不会被初始化的。
这样的话，上面的方式二调用的输出结果，就比较好解释了，由于变量j在整个函数中都有定义，而又由于传入函数的参数为空，所以函数体中的if语句不会执行，从而使得j的值为undefined.（这是我参照上面书上说的那句话的理解）
下面的例子，更好的说明：
复制代码
代码如下:
var
sssss
=
"全局变量";
function
f(){
document.write("<br/>"+sssss);//输出：undefined
而不是输出"全局变量"
var
sssss
=
"局部变量";
document.write("<br/>"+sssss);//输出：局部变量
}
