美文网首页
jq的链式调用原理

jq的链式调用原理

作者: 小豆soybean | 来源:发表于2018-09-12 14:59 被阅读0次

原文链接:https://www.cnblogs.com/songqun/p/6017951.html

(1).链式调用

    $("#mybtn").css("width","100px")

            .css("height","100px")

            .css("background","red");

(2).在对属性进行操作时建议使用JSON形式控制样式

$("#mybtn").css({
width:200,
height:"200",
"background-color":"red"
})

(3).事件中this的指向
//事件中this的指向
//JQuery中提示了一个方法,该方法可以将原生JS元素对象 转换成JQ对象
//语法结构:(原生JS元素对象) console.log((this).html());
//css方法若传递一个参数可以获取属性名的属性值
//当使用JQ中的方法取值是一般都无法进行链式调用,
//原因是方法内部return的已经不是JQ实例本身了
var result1 =("div").css("width");
console.log($result1);

(4).以下是链式调用原理

var MyJQ = function(){
}
MyJQ.prototype = {
css:function(){
console.log("设置css样式");
return this;
},
show:function(){
console.log("将元素显示");
return this;
},
hide:function(){
console.log("将元素隐藏");
}
};
var myjq = new MyJQ();
myjq.css().css().show().hide();

相关文章

网友评论

      本文标题:jq的链式调用原理

      本文链接:https://www.haomeiwen.com/subject/pfwvgftx.html