js基本操作3

<script>
window.onload = function(){
//查找父节点
//1.先获得子节点对象
var l = document.getElementById("l");
//2.通过子节点获得父节点对象
var u = l.parentNode;
//alert(u);
//3.改变父节点的属性
u.type="square";
}

</script>

<script>
//找兄弟节点
window.onload = function(){
var i = document.getElementById("i");
//获得上一个兄弟节点
i.previousSibling.previousSibling.width=200;
//获得下一个兄弟节点
i.nextSibling.nextSibling.style.border="10px solid red";
}
</script>

<script>
window.onload = function(){
/*
//创建节点
var o = document.createElement("option");
//alert(o);
//给option标签里添加内容
o.innerHTML = 1900;
//把创建好的节点添加到<select></select>里
var year = document.getElementById("year");
year.appendChild(o);//给指定元素中添加子元素
*/

var year = document.getElementById("year");

for(var i = 0;i <= new Date().getYear();i++) {
var o = document.createElement("option");
o.innerHTML = 1900 + i;
year.appendChild(o);
}
}
</script>

<script>
//删除元素
window.onload = function(){
var b = document.getElementById("b");
alert("ok");
b.removeChild(b.firstChild);//removeChild通过父元素删除子元素
}
</script>

<script>
window.onload = function(){
//1.创建font标签
var font = document.createElement("font");
//2.给font标签指定内容
font.innerHTML = "大家好";
//3.给font标签添加属性
font.setAttribute("size","7");
font.setAttribute("color","red");
font.removeAttribute("color");//删除属性
document.body.appendChild(font);
}
</script>

<script>
window.onload = function(){
//1.创建font标签
var font = document.createElement("font");
//2.给font标签指定内容
font.innerHTML = "大家好";
//3.给font标签添加属性
font.setAttribute("size","7");
font.setAttribute("color","red");
font.removeAttribute("color");//删除属性
document.body.appendChild(font);
}
</script>

<script>
//js面向对象部分
//1.闭包:在一个函数中，返回另一个函数时，会把周围的环境形成一个封闭的"环境包",其环境包里的内容全部返回，这个环境包就称为闭包
function test(){
var a = 3;
var f = function(){//f函数可以访问局部变量a,test函数执行完毕时，a并没有消失，而和f函数形成了一个封闭的环境，把这个封闭的环境就称为闭包
alert(a);
}
return f;//当返回函数f时，会连同局部变量a一起返回
}
var t = test();
t();//当调用函数时依旧能访问到局部变量a
</script>

<script>
//第一种继承方式：原型链继承

var GrandFather = function(){
this.car = "20辆";
}
var Father = function(){
this.house = "100套房";
}
Father.prototype = new GrandFather();
var Son = function(){}
Son.prototype = new Father();
var son = new Son();

alert(son.house);//Son.prototype = new Father();
alert(son.car);

//定义GrandFather,其中有一个属性，20辆车
</script>

<script>
//Js继承方式二：对象冒充

var Father = function(){
this.house = "100套房";
}

var Son = function(){
//创建一个属性保存Father构造函数
this.Father = Father;
//调用Father构造函数改变this的指向，让Father中的this指向Son
this.Father();
//删除该属性
delete this.Father;
}
var son = new Son();

alert(son.house);
</script>

<script>
//函数有call方法和apply方法

function test(){
alert("ok");
}
test();
test.call();//可以使用函数对象名.call(),调用方法
test.apply();//可以使用函数对象名.apply(),调用方法
</script>

<script>
function test(str,str1){
alert(this.name + str + str1);
}
var obj = new Object();
obj.name = "张三";
//test.call(obj,"hello","world");//call方法第一个参数是对象，从第二个参数开始，会被逐一的传给调用call方法的函数对象
test.apply(obj,["hello","world"]);
//思考如何用call或apply完成继承
</script>

<script>


//使用call或者apply完成继承
var Father = function(name){
this.house = "100套房";
this.name = name;
}

var Son = function(name){
//Father.call(this,name);
Father.apply(this,[name]);//通过call或者apply完成this的指向
}

var son = new Son("张三");

alert(son.house);
alert(son.name);
</script>