前端经典面试题合集, iframe 标签的作用是什么?有哪些优缺点?

Step 1

Q:: iframe标签的作用是什么？有哪些优缺点？

A:: iframe标签用于在一个HTML页面内嵌入另一个HTML页面。优点包括可以独立加载内容、跨域加载、实现多种布局等。缺点则是会影响页面性能、SEO不友好、安全性较低（容易被利用进行点击劫持）等。

Step 2

Q:: 如何在iframe中加载一个外部URL？

A:: 可以使用iframe标签的src属性来指定要加载的外部URL。例如：<iframe src='https://www.example.com'></iframe>。

Step 3

Q:: iframe如何解决跨域问题？

A:: 可以通过设置document.domain属性、使用postMessage API、CORS（跨域资源共享）等方法来解决iframe的跨域问题。

Step 4

Q:: iframe在安全性方面有哪些注意事项？

A:: 需要注意防范点击劫持攻击，可以使用X-Frame-Options HTTP头来防止页面被嵌入到iframe中。此外，可以使用Content Security Policy（CSP）来限制iframe的来源。

Step 5

Q:: 如何在iframe中与父页面通信？

A:: 可以使用postMessage API来实现iframe与父页面之间的安全通信。例如，iframe中的脚本可以使用window.parent.postMessage方法向父页面发送消息。