一、面向对象和面向过程的区别
1、jquery创建一个P标签：此方法为面向对象，找到对象让它去做
#（“<p>alvin</p>”).appendTo('body');
2、传统的做法：创建一个P标签,此方法为 面向过程，亲力亲为
var p=document.createElement('p');
var txt=document.createTextNode('alvin');
p.appendChild(txt);
document.appendChild(body);
重点：A、面向对象是对面向过程的封装；
二、给两个标签添加边框
<body>
<div></div>
<p></p>
</body>
<script>
onload=function(){
var divBorder=document.getElementsByTayName('div').[0];
var pBorder=document.getElementsByTayName('p').[0];
divBorder.style.border="1px solid red";
pBorder.style.border="1px solid green";
};
</script>
改良：函数--》反复执行代码块
<body>
<div></div>
<p></p>
</body>
<script>
//改良以后，函数可以获得指定标签名的所有函数
//为了让函数更好用，修改一下函数名
function tag(tag){
return document.getElementsByTagName(tag);
}
onload=function(){
var divBorder=tag("div")[0];
var pBorder=tag("p")[0];
divBorder.style.border="1px solid red";
pBorder.style.border="1px solid green";
};
</script>
三、全局污染
<script>
//变量在全局范围内有效
var a=function(){
alert("123);
};
</script>
<script>
var a=123;//把前面的函数var=function()给覆盖掉了
//在js中重复var无效,var会在第一次预解析的时候全部提取到前面去
alert(a);
</script>
结果：123 //把前面的函数var=function()给覆盖掉了
四、为了防止上面的var a全局变量的污染过，我们进行对象的封装；
为什么需要有面向对象？更快速的开发代码
<script>
var icast=function(){ //把tag 和 id封装在icast中进行调用，防止全局变量的污染
tag:function(tagName){//形参：占位符，等同于公式的变量
return document.getElementsByTagName('tagName');
},
id:function(idName){
return document.getElementById('idName');
}
};
</script>
<script type="text/javascript">
icast.tag("body")[0].style.border="1px solid red';
</script>
面向对象的优势：
A、将复杂的公式进行封装，
B、使在全局作用域的污染过变得更少，
C、把所以相近功能的代码组合到一个对象的下边，利于维护和找出错误
五、面向对象的组织形式
<script>
var icast=function(){
getElem:function(){
tag:function(){},
id:function(){}
},
css:function(){
addStyle:function(){},
removeStyle:function(){],
addClass:function(){},
removeClass:function(){},
toggleClass:function(){}
}
};
</script>
优点：
A、将所有的功能归类到某一个属性的下边，每一个都变成一个模块，利于维护
B、对于全局作用域来说只有一个对象存在：icast,可以进行灵活的使用。
扫一扫
852
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
