动态生成的IFRAME，设置SRC时的，不同位置带来的影响。以下所说的是在IE7下运行的。IE6下也是同样。在这个blog中，直接点击运行代码，和把下面代码保存到为网页在运行（以本地文件或域名访问），效果不一样。先看例子：
在JavaScript中，动态创建IFRAME元素是一种常见的技术，用于在网页中嵌入其他网页或者实现某些特定功能。然而，动态生成的IFRAME在设置`src`属性时，可能会遇到一些问题，尤其是在不同的浏览器环境下，如IE7和IE6。本文主要探讨的是在IE7下，动态设置IFRAME `src`属性时可能遇到的影响和解决方案。
一个基本的动态创建IFRAME的示例如下：
```html
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<title>动态生成IFRAME问题示例</title>
</head>
<body>
<script>
var ifr = document.createElement("IFRAME");
document.body.appendChild(ifr);
ifr.src = "http://www.baidu.com";
</script>
</body>
</html>
```
在这个例子中，IFRAME元素被创建并添加到DOM树中，然后设置其`src`属性为百度首页的URL。看似简单，但这里存在一个问题：当你在IE7下刷新页面（F5或使用刷新按钮）时，浏览器会发送一个额外的请求到`http://www.baidu.com`，尽管这个请求的状态显示为"Aborted"。这意味着即使请求被取消，服务器仍然接收到该请求，这可能对服务器性能产生潜在影响。
将`ifr.src`设置放到`appendChild`之后，虽然表面上看起来正常工作，但实际上导致了不必要的网络请求。为了解决这个问题，可以尝试在创建IFRAME元素时同时设置`src`属性，即在`appendChild`之前设置`ifr.src`。这样可以避免额外的请求。
例如：
```html
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<title>动态生成IFRAME问题示例</title>
</head>
<body>
<script>
var ifr = document.createElement("IFRAME");
ifr.src = "http://www.baidu.com";
document.body.appendChild(ifr);
</script>
</body>
</html>
```
此外，对于IFRAME的其他属性，如`frameBorder`、`scrolling`、`width`和`height`，它们的设置位置似乎没有显著影响。但值得注意的是，`ifr.src`后面添加临时参数以获取新页面内容时，如果在`appendChild`之后设置，刷新页面时临时参数不会更新，除非完全重新加载页面（非F5或刷新按钮）。这是因为IE7可能已经预加载了IFRAME的初始URL。
例如：
```html
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<title>动态生成IFRAME问题示例</title>
</head>
<body>
<script>
var ifr = document.createElement("IFRAME");
ifr.src = "http://www.baidu.com?tmp=" + (new Date().getTime().toString(36));
document.body.appendChild(ifr);
</script>
</body>
</html>
```
在这个例子中，通过添加当前时间戳作为临时参数，确保每次请求都是新的。但是，由于IE7的预加载机制，这种方法在刷新页面时可能不奏效。
有人可能会尝试使用`document.write`来插入IFRAME，但同样，这种方法也不能解决问题。`document.write`在页面加载完成后使用可能会导致整个页面重新渲染，这并不是一个理想的解决方案，尤其是在处理动态内容时。
总结来说，在IE7（以及可能的IE6）中，动态生成IFRAME并设置`src`时，应该在`appendChild`之前设置`src`，以避免不必要的网络请求和潜在的性能问题。同时，若需要确保每次请求都是新鲜的，应当在`appendChild`之前完成IFRAME的完整配置，包括临时参数的设置。对于其他浏览器，虽然可能不会有此类问题，但保持一致的编码习惯是明智的选择。
