html父页面如何向iframe框架中的页面传递参数

在HTML中，父页面向iframe框架中的页面传递参数可以通过设置iframe的src属性或使用JavaScript来实现。以下是两种常见的方法：

1. 使用URL参数传递：
在父页面中，可以通过在iframe的src属性中加入查询字符串（query string）来传递参数。例如：

   <iframe src="child_page.html?param1=value1&param2=value2" ...></iframe>

在iframe框架中的child_page.html页面里，可以通过JavaScript来获取这些参数：

   function getQueryVariable(variable) {
       var query = window.location.search.substring(1);
       var vars = query.split('&');
       for (var i = 0; i < vars.length; i++) {
           var pair = vars[i].split('=');
           if (decodeURIComponent(pair[0]) == variable) {
               return decodeURIComponent(pair[1]);
           }
       }
       return null;
   }

   var param1 = getQueryVariable('param1'); // 获取param1的值
   var param2 = getQueryVariable('param2'); // 获取param2的值

2. 使用JavaScript的window.postMessage方法：
HTML5引入了window.postMessage方法，它提供了一种安全的方式来实现跨源通信，即允许一个页面和另一个“不同源”的页面进行通信。父页面和iframe页面可以约定一个事件监听和触发机制来传递参数。

父页面向iframe发送消息：

   var iframe = document.getElementById('iframeId');
   var iframeWindow = iframe.contentWindow;
   iframeWindow.postMessage({param1: 'value1', param2: 'value2'}, '*');

iframe中的页面接收消息：

   window.addEventListener('message', receiveMessage, false);

   function receiveMessage(event) {
       var data = event.data;
       if (data.param1) {
           console.log(data.param1); // 使用param1的值
       }
       if (data.param2) {
           console.log(data.param2); // 使用param2的值
       }
   }

在使用postMessage时，必须确保接收和发送页面遵守相同的安全协议和端口，否则postMessage会失败。通常需要在iframe页面和父页面上都设置消息监听器。