iframe是指內(nèi)嵌框架,可以將其他網(wǎng)頁嵌入到當(dāng)前頁面中,實(shí)現(xiàn)在一個(gè)頁面內(nèi)同時(shí)顯示多個(gè)網(wǎng)頁內(nèi)容。而iframe name屬性則決定了在父頁面中如何操作子頁面。
使用jQuery操作iframe可以更加方便快捷。如下代碼可獲取指定iframe并進(jìn)行內(nèi)容查詢與替換:
var $iframe = $('iframe[name=example]'); $iframe.contents().find('p').each(function() { if($(this).text() == 'old text') { $(this).text('new text'); } });
其中,iframe可以通過選擇器和name屬性獲取。$iframe.contents()方法可獲取iframe內(nèi)的文檔對(duì)象,包括head和body標(biāo)簽。find()方法可在文檔對(duì)象中查詢指定元素,這里查詢到所有p標(biāo)簽并遍歷。若p標(biāo)簽的文本內(nèi)容為"old text",則將其內(nèi)容替換為"new text"。
通過上述代碼,我們可以輕松地操作iframe頁面內(nèi)容,實(shí)現(xiàn)其他js代碼難以處理的操作。需要注意的是,由于瀏覽器的同源策略,操作同源iframe的代碼可以直接在父頁面中執(zhí)行,但操作異源iframe需要在子頁面中加載jquery庫(kù),并使用postMessage方法與父頁面通信。
下一篇怎么css 等高