本文编写于 1231 天前,最后修改于 1231 天前,其中某些信息可能已经过时。
如何在typecho里加入单独的自定义内容?
想了好久,想了加script,想了首次加载的时候jquery,想了很多,没想到。。。
先展示一个demo
实现方法
最近在别的博客那里看到有位大佬在自定义页面加了一个“舔狗日记”的小窗口,觉得十分好玩,遂很好奇他是怎么做到在自定义页面里插入这个H5的
F12 后发现,iframe原来是可以用的
那之前想的用script啥的,的确就很傻了😄
iframe的常用属性
以<iframe>
标签包裹后,这些属性为常用属性
name
: 规定<iframe>
的名称。width
: 规定<iframe>
的宽度。height
:规定<iframe>
的高度。src
:规定在<iframe>
中显示的文档的 URL。frameborder
: 规定是否显示<iframe>
周围的边框。 (0为无边框,1位有边框)。align
: 规定如何根据周围的元素来对齐<iframe>
。 (left,right,top,middle,bottom)。scrolling
: 规定是否在<iframe>
中显示滚动条。 (yes,no,auto)
获取iframe里面的内容
var iframe = document.getElementById("myframe"); //获取iframe标签
var iwindow = iframe.contentWindow; //获取iframe的window对象
var idoc = iwindow.document; //获取iframe的document对象
console.log(idoc.documentElement); //获取iframe的html
console.log("body",idoc.body);
获取iframe中的Dom元素
var ifr = document.getElementById("myframe2");
var dom= ifr.contentWindow.document.getElementById("textid")
然后就可以操作内部的dom了
如果是内部iframe操作父级内容,可以这么操作
var par1 = window.parent.document.getElementById("div")//vanilla js
var par2 = window.parent.$("div")//jquery
参考资料
- [iframe调用父页面方法](
→_→
孤独求败 2020-07-08 21:40