iframe vs innerHTML用于模态对话 - 哪个更好?

时间:2021-03-02 17:11:19

I am emulating a modal window functionality on my HTML5 page by creating a div with position: fixed, centered in the browser window etc. In some cases my modal window just shows a message with one or more buttons, such as OK Cancel, but in other cases I'm showing more complicated forms, e.g. an instant messaging dialog.

我在我的HTML5页面上模拟一个模态窗口功能,通过创建一个位置为div的div:固定,在浏览器窗口中居中等。在某些情况下,我的模态窗口只显示带有一个或多个按钮的消息,例如OK取消,但是其他情况我正在展示更复杂的形式,例如即时消息对话框。

The question is for the more complicated cases. So which is better, (1) to have an <iframe> in my "modal" window or (2) a <div> plus some Ajax code that retrieves the contents of my form and injects it into the div's innerHTML?

问题是更复杂的情况。那么哪个更好,(1)在我的“模态”窗口中有一个

What are some caveats in either case? When you choose one over the other, what is your reasoning?

在这两种情况下有什么警告?当你选择一个而不是另一个时,你的理由是什么?

Browser requirements: IE9+ and the rest of the sane browsers.

浏览器要求:IE9 +和其他理智的浏览器。

1 个解决方案

#1


5  

You should only use an iframe if you actually need an iframe. Reasons to use an iframe are:

如果您确实需要iframe,则应该只使用iframe。使用iframe的原因是:

  1. The simplest way to load content from another domain.
  2. 从另一个域加载内容的最简单方法。

  3. To isolate the security context for content from a separate domain.
  4. 从单独的域中隔离内容的安全上下文。

  5. To embed a completely independent web page (independent scripts, independent style sheets, etc...) in your web page.
  6. 在您的网页中嵌入一个完全独立的网页(独立脚本,独立样式表等)。

  7. You don't want to write ajax code to load content dynamically and want to just use the built-in .src capability of an iframe.
  8. 您不想编写ajax代码来动态加载内容,并且只想使用iframe的内置.src功能。

If you don't need any of these capabilities of an iframe, then it's generally easier to use use a div (which will auto-size to its content - whereas an iframe will not) and put the desired content in that div.

如果您不需要iframe的任何这些功能,那么通常更容易使用div(它将自动调整其内容大小 - 而iframe不会)并将所需内容放入该div中。

Either can be made to work.

两者都可以使用。

#1


5  

You should only use an iframe if you actually need an iframe. Reasons to use an iframe are:

如果您确实需要iframe,则应该只使用iframe。使用iframe的原因是:

  1. The simplest way to load content from another domain.
  2. 从另一个域加载内容的最简单方法。

  3. To isolate the security context for content from a separate domain.
  4. 从单独的域中隔离内容的安全上下文。

  5. To embed a completely independent web page (independent scripts, independent style sheets, etc...) in your web page.
  6. 在您的网页中嵌入一个完全独立的网页(独立脚本,独立样式表等)。

  7. You don't want to write ajax code to load content dynamically and want to just use the built-in .src capability of an iframe.
  8. 您不想编写ajax代码来动态加载内容,并且只想使用iframe的内置.src功能。

If you don't need any of these capabilities of an iframe, then it's generally easier to use use a div (which will auto-size to its content - whereas an iframe will not) and put the desired content in that div.

如果您不需要iframe的任何这些功能,那么通常更容易使用div(它将自动调整其内容大小 - 而iframe不会)并将所需内容放入该div中。

Either can be made to work.

两者都可以使用。