访问嵌套在iframe中的表单

Question

我正在尝试访问一个表单及其元素。这个表单在一个iframe中，而访问表单的javascript代码位于主文档内。

如果我需要添加其他信息，请告诉我。

（表单和主页面在同一个域中）

谢谢

- brulak

Answer 1

var ifr = document.getElementById( yourIframeId );
var ifrDoc = ifr.contentDocument || ifr.contentWindow.document;
var theForm = ifrDoc.getElementById( yourFormId );

或者您可以在框架中编写一些代码，将变量设置为表单的parent，但我不会信任这种方法。

- George IV

---

未捕获的DOM异常：无法从“HTMLIFrameElement”读取“contentDocument”属性：被阻止的帧来自不同的域，因此它无法工作。 - Raj Kumar Samala

你有什么建议可以让这个程序也能在跨域情况下工作吗？ - Raj Kumar Samala

尝试将其作为书签小工具或TamperMonkey脚本 - 其DTP插件甚至可以在Android上的Kiwi中使用。提供了带有工作示例的答案（除了为了可读性而格式化为多行）。 - Tom

Answer 2

如果您的iframe带有name属性，那么它可以用作窗口名称。 如果框架名称是“myframe”：

myframe.document.getElementById("myform") // gives you the form element

- Ates Goral

---

您也可以使用框架ID来获取元素ID，就像您从框架中通过ID获取表单一样。当然，表单也必须有一个ID。 - Eddie

Answer 3

我基于我的旧文章制作了一个书签小程序。

（该文章）

该小程序在 iframe 中进行读取，将结果 JSON 设置到文本区域并打印到控制台：

javascript:o=document.getElementById("wf_IFid").contentDocument;
f=o.getElementsByTagName("input"), longest=f.length;
frm=f;
values={};
p=0;
for(a=0;a<longest;a++){
  el=frm[a];
  switch(el.type){
    case "checkbox":
      values[el.name]=el.checked;
      break;
    case "radio":
      if(el.checked)values[el.name]=el.value;
      else if(values[el.name]===undefined)values[el.name]=false;
      break;
    case "select-one":
      values[el.name]=el.selectedIndex<0?-1:el.options[el.selectedIndex].value;
      break;
    case "select-multiple":
      values[el.name]=[];
      for(i=0;i<el.options.length;i++){
        if(el.options[i].selected)values[el.name].push(el.options[i].value)
      }
      break;
    case "fieldset":
      break;
    case "button":
      break;
    case "submit":
      break;
    case "reset":
      break;
    case "file":
      break;
    case undefined:
      break;
    default:
      {
        if(el.getAttribute("aria-label")&&el.value){
          key=p++ + "|" + el.getAttribute("aria-label");
          values[key]=el.value
        }
      }
  }
}
t=o.createElement("textarea");
t.value=JSON.stringify(values, null, 2);
o.body.prepend(t);
console.log(JSON.stringify(values, null, 2));

- Tom