html父页面调用子页面方法

在 HTML 中，父页面可以通过以下方式调用子页面的方法：

1. 使用 iframe 标签将子页面嵌入到父页面中，并设置一个 ID：

<iframe id="myFrame" src="子页面的 URL"></iframe>

2. 在父页面中获取 iframe 元素，并通过 contentWindow 属性获取子页面的 window 对象：

var myFrame = document.getElementById("myFrame");
var childWindow = myFrame.contentWindow;

3. 通过子页面的 window 对象调用其方法：

childWindow.myFunction();

其中，myFunction() 是子页面中的方法名。注意，子页面必须在同一域名下，否则浏览器会阻止跨域访问。

相关问题

html 子页面回传数据父页面

在HTML中，子页面可以通过JavaScript调用父页面的函数，从而将数据回传给父页面。具体的方法如下：

1. 在父页面中定义一个函数，用于接收子页面传回来的数据。

function receiveData(data) {
    //处理传回来的数据
}

2. 在子页面中调用父页面的函数，并将数据作为参数传入。

//获取父页面的window对象
var parentWindow = window.parent;
//调用父页面的函数，并将数据作为参数传入
parentWindow.receiveData(data);

在调用父页面的函数时，需要通过window.parent获取到父页面的window对象，然后再调用父页面中定义的函数。这样就可以在子页面中将数据回传给父页面了。

vue2子页面调父页面方法

在Vue2中，子组件可以通过事件来调用父组件的方法。以下是一种常见的方法：

1. 在父组件中定义一个方法，用于接收子组件传递的数据或触发的事件。
2. 在子组件中通过`$emit`方法触发一个自定义事件，并传递需要传递给父组件的数据。
3. 在父组件的模板中使用子组件，并通过`v-on`指令监听子组件触发的事件，将其与父组件中定义的方法进行绑定。

下面是一个示例：

父组件：

<template>
  <div>
    <h2>父组件</h2>
    <p>子组件传递的数据：{{ message }}</p>
    <ChildComponent v-on:child-event="handleChildEvent"></ChildComponent>
  </div>
</template>

<script>
import ChildComponent from './ChildComponent.vue';

export default {
  components: {
    ChildComponent
  },
  data() {
    return {
      message: ''
    };
  },
  methods: {
    handleChildEvent(data) {
      this.message = data;
      // 在这里可以调用父组件的其他方法
    }
  }
};
</script>

子组件：

<template>
  <div>
    <h3>子组件</h3>
    <button @click="emitEvent">触发事件</button>
  </div>
</template>

<script>
export default {
  methods: {
    emitEvent() {
      const data = 'Hello, 父组件！';
      this.$emit('child-event', data);
    }
  }
};
</script>

在上述示例中，子组件通过`$emit`方法触发了一个名为`child-event`的自定义事件，并传递了一个字符串数据。父组件通过`v-on`指令监听了子组件触发的`child-event`事件，并将其与父组件中的`handleChildEvent`方法进行绑定。当子组件中的按钮被点击时，父组件的`handleChildEvent`方法会被调用，并接收到子组件传递的数据。