Menu
Woocommerce Menu

一步一步教你写一个jQuery的插件教程,跨域问题的实现思路

0 Comment

面向对象与基于对象 差非常的少每一个开垦职员都有面向对象语言(比如C++、C#、Java)的开支经历。
在观念面向对象的言语中,有七个极其首要的定义 – 类和实例。
类定义了一类东西公共的表现和措施;而实例则是类的贰个有血有肉贯彻。
我们还驾驭,面向对象编制程序有七个基本点的概念 – 封装、承接和多态。

js 要跨域的话,能够用:
<script
src=”别的网址的js地址(这里的内空能够是动态变化的,如:aaa.jsp、bbb.aspx)都得以。”></script>那样是足以从其他网址内部读抽出数据的。
重大是看您灵不灵便,会不会用了。
ajax要跨域的话,能够用服务器去别的网址取内容,如asp.net的:

jQuery 的plugin开拓要求留神的政工,

然则在JavaScript的世界中,全数的这一体天性如同都不设有。
因为JavaScript本身不是面向对象的言语,而是根据对象的语言。
那在那之中就有局地有趣的特征,比如JavaScript中有所东西都是目的,
包括字符串、数组、日期、数字,以至是函数,例如上边那一个事例:

复制代码 代码如下:

  1.       鲜明jQuery的命名空间独有三个。
    2.       掌握options参数用来支配plugin的表现。
    3.       为暗中同意的plugin设定提供公共的拜会权限。
    4.       为子函数提供公共的探访权限。
    5.       私有的函数相对是私家庭访谈问
    6.       支持metadata plugin。
    本身将会在下边包车型地铁例子中二个多少个的辨证地点那多少个标准,做完那些工作后大家就能创制一个高亮显示text的简约插件。

  2. 旗帜分明jQuery的命名空间只有贰个

复制代码 代码如下:

public string GetUrlData(string url)
{
System.Net.HttpWebRequest webRequest =
(System.Net.HttpWebRequest)System.Net.WebRequest.Create(url);
System.Net.WebResponse webResponse = webRequest.GetResponse();
System.IO.Stream iStream = webResponse.GetResponseStream();
System.IO.StreamReader sr = new System.IO.StreamReader(iStream,
System.Text.Encoding.Default);
string str = sr.ReadToEnd();
sr.Close();
iStream.Close();
webResponse.Close();
return str;
}

在大家的事例里,大家将会取名那几个插件名称为hilight,

// 定义一个函数 – add
function add(a, b) {
add.invokeTimes++;
return a + b;
}
//
因为函数本身也是目的,这里为函数add定义二个属性,用来记录此函数被调用的次数
add.invokeTimes = 0;
add(1 + 1);
add(2 + 3);
console.log(add.invokeTimes); // 2

其一法子已经写好了,你一旦传入网址的url地址,就足以博得你要的ajax再次回到值。
这么就将其他网址的ajax必要,写到了自已的服务器里,然后你再用ajax去央浼自已写好的丰盛
aspx地址就足以了。
若果是java,也是同一的道理,如:

图片 1

依傍JavaScript中类和后续
在面向对象的语言中,我们利用类来创建一个自定义对象。但是JavaScript中负有东西都是指标,那么用哪些艺术来创建自定义对象啊?
这就需求引入其余贰个概念 –
原型(prototype),大家得以归纳的把prototype看做是贰个模板,新创造的自定义对象都是其一模版(prototype)的三个拷贝
(实际上不是拷贝而是链接,只不过这种链接是不可知,给大伙儿的认为好疑似拷贝)。
让大家看一下经过prototype创造自定义对象的三个例证:

复制代码 代码如下:

也正是我们的plugin能够由此下边包车型地铁格局来接纳:

复制代码 代码如下:

URL url = new URL(“”);
FilterInputStream f=(FilterInputStream)url.openStream();

图片 2

// 构造函数
function Person(name, sex) {
this.name = name;
this.sex = sex;
}
// 定义Person的原型,原型中的属性能够被自定义对象援用
Person.prototype = {
getName: function() {
return this.name;
},
getSex: function() {
return this.sex;
}
}

自然asp,php的原理也是同等的,正是采取小偷函数达成获取内容。

怎么jQuery的plugin唯有三个命名空间?大概是统筹的渴求,或然是那样的话可读性更加强,亦或然为了面向对象的设计方式。

此地大家把函数Person称为构造函数,也正是创办自定义对象的函数。能够见到,JavaScript通过构造函数和原型的法子模拟完结了类的效应。
制造自定义对象(实例化类)的代码:

要跨域的话,能够用: script
src=”别的网址的js地址(这里的内空能够是动态变化的,如:aaa.jsp、bbb.aspx)都足以。”/script那样是能够从其余网…

2.明白options参数来支配plugin的一举一动。

复制代码 代码如下:

 
让大家先为大家的hilight插件鲜明一下foreground和background的颜色。我们应当能够允许那五个option作为option对象传递给plugin的主函数。举个例子:

var zhang = new Person(“ZhangSan”, “man”);
console.log(zhang.getName()); // “ZhangSan”
var chun = new Person(“ChunHua”, “woman”);
console.log(chun.getName()); // “ChunHua”

图片 3

今世码var zhang = new Person(“ZhangSan”,
“man”)执行时,其实个中做了之类几件事情:
成立三个空手对象(new Object())。
拷贝Person.prototype中的属性(键值对)到那一个空对象中(大家前边提到,内部贯彻时不是拷贝而是叁个遮蔽的链接)。
将那个目的通过this关键字传递到构造函数中并实施构造函数。
将这几个目的赋值给变量zhang。
为了求证prototype模版实际不是被拷贝到实例化的对象中,而是一种链接的主意,请看如下代码:

前几日插件可以设定如下的习性:

复制代码 代码如下:

图片 4

function Person(name, sex) {
this.name = name;
this.sex = sex;
}
Person.prototype.age = 20;
var zhang = new Person(“ZhangSan”, “man”);
console.log(zhang.age); // 20
// 覆盖prototype中的age属性
zhang.age = 19;
console.log(zhang.age); // 19
delete zhang.age;
// 在剔除实例属性age后,此属性值又从prototype中获得
console.log(zhang.age); // 20

  1. 为私下认可的plugin设定提供公共的拜见权限。
标签:,

发表评论

电子邮件地址不会被公开。 必填项已用*标注

相关文章

网站地图xml地图