Javascript可以切换框架边框吗？_Javascript_Html_Css

Javascript可以切换框架边框吗？

javascript html css

Javascript可以切换框架边框吗？,javascript,html,css,Javascript,Html,Css,我正在尝试使用JS切换帧的frameborder属性。以下是我的测试用例： <html> <head> <script type="text/javascript"> function off() { var f1 = document.getElementById("f1"); var f2 = document.getElementById("f2"); alert ("before, frame f1

我正在尝试使用JS切换帧的frameborder属性。以下是我的测试用例：

<html>
  <head>
  <script type="text/javascript">
    function off() {
      var f1 = document.getElementById("f1");
      var f2 = document.getElementById("f2");
      alert ("before, frame f1 had frameBorder=" + f1.frameBorder);
      f1.frameBorder = "0";
      alert ("after, frame f1 has frameBorder=" + f1.frameBorder);
      alert ("before, frame f2 had frameBorder=" + f2.frameBorder);
      f2.frameBorder = "0";
      alert ("after, frame f2 has frameBorder=" + f2.frameBorder);
    }
  </script>
  </head>

  <frameset cols="50%, 50%" name="fs">
    <frame frameborder="1" src="http://bikeshed.com" id="f1" name="f1" />
    <frame frameborder="1" src="http://bikeshed.com" id="f2" name="f2" />
  </frameset>
</html>


函数off（）{
var f1=document.getElementById（“f1”）；
var f2=document.getElementById（“f2”）；
警报（“之前，帧f1具有frameBorder=“+f1.frameBorder”）；
f1.frameBorder=“0”；
警报（“之后，帧f1具有frameBorder=“+f1.frameBorder”）；
警报（“之前，第f2帧有frameBorder=“+f2.frameBorder”）；
f2.frameBorder=“0”；
警报（“之后，帧f2具有frameBorder=“+f2.frameBorder”）；
}

我在Firefox中加载它，打开Firebug，然后在控制台中键入“off（）”。它运行my函数，该函数报告两个frameborders都已设置为“1”，现在设置为“0”。。但是，帧边框无法消失

我想做的事可能吗？如果是，怎么做？

对于某些属性，您需要使用。试一试

使用iFrame而不是框架似乎是可行的。您必须对CSS进行一些处理才能完成框架集的幻觉

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">

<html lang="en">
<head>
  <title>Frame Test</title>
  <script language="javascript">
    var off = function () {
      document.getElementById('frame1').style.borderWidth = 0;
      alert('off');
    }
  </script>


</head>
<body style="margin: 0; padding: 0">
<table style="width: 100%; height: 100%" cols="2">
<tr>
<td><iframe id="frame1" src="http://www.google.com" style="margin: 0; width: 100%; height: 100%"></iframe></td>
<td><iframe id="frame2" src="http://www.google.com" style="margin: 0; width: 100%;  height: 100%"></iframe></td>
</tr>
</table>

</body>
</html>


框架测试
var off=函数（）{
document.getElementById（'frame1'）。style.borderWidth=0；
警报（“关闭”）；
}

虽然您可以更改frameborder属性，但Safari和FF都不会重新呈现页面，因此您不会注意到更改。这在IE8中不起作用。Internet Explorer将框架边框视为CSS边框的单独边框！（我目前的问题是，我无法使用脚本清除IE8中的frameborder-我怀疑IE8只是没有更新页面（如顶部评论中所暗示的），因为属性似乎设置为OK？！）我认为它应该是

frameborder

，大写为B。但事实上，这些天来，当应用于iFrame时，要么在FF 3.6上工作，正如上面@Patrick所建议的那样，@w3d：“frameborder”更为正确，因为属性名都是小写的。您可能会考虑在访问CSS属性时使用驼峰大小写，而frameborder不是，以替换CSS属性名称中的破折号。在Firefox中，这就是两者都起作用的原因。其他一些浏览器似乎也这么做，尽管这不是标准行为，所以不应该依赖。Patrick没有使用frameborder属性，所以我不确定你的第二句话是什么意思。感谢你对

setAttribute

的澄清，是的，“frameborder”（全小写）似乎更正确，更有意义。然而，我的困惑是因为相应的JavaScript属性是

frameBorder

，因此如果使用对象点符号来设置属性/属性，则必须使用

iframeObj.frameBorder=0

才能删除frameBorder属性。IE之前（？）无法区分属性和属性，而且

setAttribute（'frameborder'，0）

在IE8中不起作用，这进一步混淆了这一点。@otis在提到Patrick的帖子时，我实际上只是指他对iFrame的使用。我最近一直在处理iFrame，而不是帧本身。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">

<html lang="en">
<head>
  <title>Frame Test</title>
  <script language="javascript">
    var off = function () {
      document.getElementById('frame1').style.borderWidth = 0;
      alert('off');
    }
  </script>


</head>
<body style="margin: 0; padding: 0">
<table style="width: 100%; height: 100%" cols="2">
<tr>
<td><iframe id="frame1" src="http://www.google.com" style="margin: 0; width: 100%; height: 100%"></iframe></td>
<td><iframe id="frame2" src="http://www.google.com" style="margin: 0; width: 100%;  height: 100%"></iframe></td>
</tr>
</table>

</body>
</html>