单体：
var ton = {
name:'tom',
age:18,
showName:functionn(){
alert(this.name);},
showAge:function(){
alert(this.age);},}
Tom.showName();
工厂模式：
function Person(name,age,job){
var o = new Object();
var o = {};两种方法
o.name = name;
o.age = age;
o.job = job;
o.showName = function(){
alert(this.name);}
o.showage = function(){
alert(this.age);}
o.showjob = function(){
alert(this.job);}
return o;
}
var Tom = Person('tom',18,'程序员");
Tom.showJob();
构造函数：
function Person(name,age,job){
this.name = name;
this.age = age;
this.job = job;
this.showName = function(){
alert(this.name);
}
this.showAge = function(){
alert(this.Age);
}
this.showJob = function(){
alert(this.job);
}
}
var Bob = new Personn('bob',18,'产品汪');
Bob.showJob();
原型模式：
function Person(name,age,job){
this.name = name;
this.age = age;
this.job = job;
}
Person.prototype.showName = function(){
alert(this.name);
}
Person.prototype.showAge = function(){
alert(this.age);
}
Person.prototype.showJob = function(){
alert(this.job);
}
var Lucy = new Person('lucy',18,"测试鼠")；
var Lily = new Person('lily',18,"市场鸡")；
call 和 apply 的区别;
function aa(a，b){
alert('我的this是' + this+',我的a是’+a+ ',我的b是' +b);
}
aa.call('abc',2,3);
aa.apply('abc',[2,3]);
改变当前的this区别在于apply方法要将参数放到数组里在传参
函数的继承：
function Fclass(name,age) {
this.name = name;
this.age = age;
}
Fclass.prototype.showName = function () {
alert(this.name);
}
Fclass.prototype.showAge = function () {
alert(this.age);
}
function Sclass(name,age,job) {
Fclass.call(this,name,age);//属性的继承
this.job = job;
}
Sclass.prototype = new Fclass();//方法的继承
Sclass.prototype.showJob = function () {
alert(this.job);
}
var Driver = new Sclass('tom',18,'老司机');
新增选择器：
document.querySelector('id')
document.querySelectorAll('class')
jquery加载：
$(document).ready(function () {
var $div = $('#div');
alert('Jquery' + div.innerHTML)
})
$(function () {
var $div = $('#div');
alert('Jquery' + div.innerHTML)
})
jquery选择器：
$(function () {
$('#div1').css({
color:'pink'
});;
$('.box').css({
fontSize:'15px'
});;
$('.list li').css({
backgroundColor:'green',
color:'#fff',
fontSize:'20px',
marginBottom:'10px'
});
$('#div1').next().css({//class为div1的下一个元素
});
$('#div1').nextAll('p').css({//div1后边所有的p元素
});
$('#div1').parent().css({//转移到父元素身上
});
$('#div1').closest('div').css({//选择离自己最近的div祖先元素
})
})
jquery样式操作：
$(function () {
alert($('div1').css('fontSize'));//读取属性
$('div1').addClass('big');//添加类 .removeClass删除样式
})
点击事件：
$(function () {
$('#btn').click(function () {//点击后执行里边代码
$('.box').toggleClass('sty');//toggleclass box的class里有sty就删除。没有就添加
})
})
索引值：
$(function () {
$('.list li').click(function () {
// alert(this.innerHTML);
alert($(this).index())//获取索引值
})
})
选项卡：
$(function () {
$('#btns input').click(function () {
$(this).addClass('cur').siblings().removeClass('cur');//sibings选中所有的兄弟元素 然后移除行间样式
$('#contents div').eq($(this).index()).addClass('active').siblings().removeClass('active')
//.eq($(this).index())索引值等于点击的div .addClass('active')添加激活样式.siblings().removeClass('active')其他兄弟移除样式
})
})
网友评论