摘要:众所周知,利用浏览器不限制加载跨域外部资源的特性,使用标签属性请求接口,加载数据,在中触发提前声明好的函数拿到数据,前端的前辈们这一手操作简直就是犀利。现代浏览器提供了这个,使得通过可以拿到某个元素最终应用的样式。
众所周知,jsonp利用浏览器不限制加载跨域外部资源的特性,使用script标签src属性请求接口,加载数据,在script中触发提前声明好的函数拿到数据,前端的前辈们这一手操作简直就是犀利。
其实实现单向的接口调用使用任何资源标签都可以实现,关键在于如何取到后端传回的数据实现双向交互。
现代浏览器提供了getComputedStyle这个API,使得通过js可以拿到某个元素最终应用的css样式。(低版本IE中为currentStyle)。如下所示:
如此一来,我们就可以在css样式中取得想要的数据文本
1.利用伪类的::after或::before的 { content:"{数据}" } 或者利用 font-family:"{数据}"
data.css 代码 .data-div{ font-family: "{a:"1"}"; }
2.动态加载css样式,并监听其load事件,我这里用的是静态文件(上边的data.css),有兴趣的可以写个接口试下。
3.点击数据标签,可以看到输出结果如下:
PS:这个方法和JSONP一样需要后端配合将数据按一定的规则拼接给前端,其实放到现在并没什么卵用,现在已经很少有看到用JSONP实现跨域请求的。但是自己玩一玩还是可以的,顺便致敬一波JSONP,致敬一波前辈们
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/114089.html
摘要:众所周知,利用浏览器不限制加载跨域外部资源的特性,使用标签属性请求接口,加载数据,在中触发提前声明好的函数拿到数据,前端的前辈们这一手操作简直就是犀利。现代浏览器提供了这个,使得通过可以拿到某个元素最终应用的样式。 众所周知,jsonp利用浏览器不限制加载跨域外部资源的特性,使用script标签src属性请求接口,加载数据,在script中触发提前声明好的函数拿到数据,前端的前辈们这一...
摘要:众所周知,利用浏览器不限制加载跨域外部资源的特性,使用标签属性请求接口,加载数据,在中触发提前声明好的函数拿到数据,前端的前辈们这一手操作简直就是犀利。现代浏览器提供了这个,使得通过可以拿到某个元素最终应用的样式。 众所周知,jsonp利用浏览器不限制加载跨域外部资源的特性,使用script标签src属性请求接口,加载数据,在script中触发提前声明好的函数拿到数据,前端的前辈们这一...
摘要:但最近又听说了另一种跨站攻击,于是找了些资料了解了一下,并与放在一起做个比较。脚本中的不速之客全称跨站脚本,是注入攻击的一种。 XSS:跨站脚本(Cross-site scripting) CSRF:跨站请求伪造(Cross-site request forgery) 在那个年代,大家一般用拼接字符串的方式来构造动态 SQL 语句创建应用,于是 SQL 注入成了很流行的攻击方式。...
摘要:超详细并且带的跨域指南来了本文基于你了解的同源策略,并且了解使用跨域跨域的理由。使用方法就是将符合上述条件页面的设置为同样的二级域名。这两个网站都是协议,端口都是,且二级域名都是。 超详细并且带 Demo 的 JavaScript 跨域指南来了! 本文基于你了解 JavaScript 的同源策略,并且了解使用跨域跨域的理由。 1. JSONP 首先要介绍的跨域方法必然是 JSONP。 ...
摘要:从现在开始,养成写技术博客的习惯,或许可以在你的职业生涯发挥着不可忽略的作用。如果想了解更多优秀的前端资料,建议收藏下前端英文网站汇总这个网站,收录了国外一些优质的博客及其视频资料。 前言 写文章是一个短期收益少,长期收益很大的一件事情,人们总是高估短期收益,低估长期收益。往往是很多人坚持不下来,特别是写文章的初期,刚写完文章没有人阅读会有一种挫败感,影响了后期创作。 从某种意义上说,...
阅读 1406·2021-09-10 11:27
阅读 2358·2019-08-30 15:53
阅读 1214·2019-08-30 13:10
阅读 2942·2019-08-30 11:09
阅读 1046·2019-08-29 17:23
阅读 624·2019-08-29 17:05
阅读 2908·2019-08-29 15:10
阅读 2314·2019-08-29 13:22