How to add individual customized content in typecho?

I thought for a long time about adding script and jquery when it was first loaded...

First show a demo

Implementation method

Recently, I saw a big guy in another blog adding a small window of "Dog Licking Diary" on the custom page. I thought it was very funny, so I was curious about how he inserted this H5 into the custom page

After F12, it was found that iframe was usable

It's really silly to use script or something 😄

Common properties of iframe

with <iframe> After label wrapping, these attributes are common attributes

• name : Provisions <iframe> The name of the.
  • width : Provisions <iframe> The width of.
  • height : Provisions <iframe> The height of.
  • src : Specified in <iframe> The URL of the document displayed in.
  • frameborder : Specify whether to display <iframe> The surrounding border. (0 is no border, and 1 bit has a border).
  • align : Specify how to align according to surrounding elements <iframe> 。 　(left, right,top,middle,bottom)。
  • scrolling : Specify whether the <iframe> Scroll bars are displayed in. (yes,no,auto)

Get the contents of iframe

 var iframe = document.getElementById("myframe"); // Get iframe tag Var iwindow=iframe. contentWindow;//Get the window object of iframe Var idoc=iwindow.document;//Get the document object of iframe console.log(idoc.documentElement); // Get the html of iframe console.log("body",idoc.body);

Get Dom element in iframe

 var ifr = document.getElementById("myframe2"); var dom=  ifr.contentWindow.document.getElementById("textid")

Then you can operate the internal dom

If it is an internal iframe operation parent content, it can be operated as follows

 var par1 = window.parent.document.getElementById("div")//vanilla js var par2 = window.parent.$("div")//jquery

reference material

1. Js gets the dom element in the iframe

2. Native js obtains dom elements in iframe -- the method for parent and child pages to obtain each other's dom elements

3. Iframe accesses parent page and child page

4. [iframe calls parent page method]（