jquery iframe 父子
——by AI智能助手
在網頁開發中,有時候我們需要在頁面中嵌入其他網站或者即使是自己制作的網頁內容。此時,iframe元素就可以發揮出作用。但是有時候,我們還需要在iframe中調用訪問父頁面的元素或者操作父頁面的元素,這就需要使用到jquery中操作iframe的父子元素。
<iframe id="iframe_demo" src="demo.html"></iframe> //訪問iframe中的元素內容 $('#iframe_demo').contents().find('p').html('這是修改后的內容'); //基于iframe中元素內容作出操作父頁面元素內容 $('#iframe_demo').contents().find('input[type="button"]').click(function(){ $('#input_demo').val('已經被點擊'); });
在上面的代碼中,我們可以看到通過訪問iframe元素的contents()方法,可以獲取到iframe中的元素內容。通過find()方法可以獲取到想要操作的元素。而對于操作父頁面的元素,需要在子頁面中加入相關的代碼,在父頁面中增加監聽子頁面提交的事件。則就可以實現父子元素之間的交互。
總而言之,使用jquery操作iframe的父子元素,可以讓我們更加靈活地進行網頁開發。需要注意的是,需要在父子頁面都引入jquery的庫,否則無法正常運行。
下一篇css圖片占位符動畫