Fatal编程技术网

Javascript 在HTML5中创建框架

javascript css html

Javascript 在HTML5中创建框架,javascript,css,html,Javascript,Css,Html,我是Qt+C++ UI程序员和新的HTML，试图用HTML创建框架。请参阅所附图片。 框架由4个区域组成：—— 顶部---包含固定按钮（在运行时不会更改） 左侧---包含按钮（将在运行时更改） 中间---包含按钮和消息（将在运行时更改） 右---这在3个分区中包含不同的链接 现在我想实现以下目标：--- 顶部分区：—— 当按下顶部分区上的第一个按钮时--4新建 按钮创建在左分区上 当按下顶部分区上的第二个按钮时--10新 按钮创建在左分区上 顶部分区的其他按钮也是如此 左派：—— 当按下左侧分区

我是Qt+C++ UI程序员和新的HTML，试图用HTML创建框架。请参阅所附图片。
框架由4个区域组成：——

  • 顶部---包含固定按钮（在运行时不会更改）
  • 左侧---包含按钮（将在运行时更改）
  • 中间---包含按钮和消息（将在运行时更改）
  • 右---这在3个分区中包含不同的链接
    • 现在我想实现以下目标：---

    顶部分区：——

  • 当按下顶部分区上的第一个按钮时--4新建 按钮创建在左分区上
  • 当按下顶部分区上的第二个按钮时--10新 按钮创建在左分区上
  • 顶部分区的其他按钮也是如此
    • 左派：——

  • 当按下左侧分区上的第一个按钮时---6新建 按钮和消息在中间分区上创建
  • 当按下左侧分区上的第二个按钮时--8新 按钮和消息在中间分区上创建
  • 对于左分区的其他按钮也是如此
    • 右分区：---

  • 右分区包含一些分区，我最多可以显示4个分区 链接。还可以更改链接和运行时
    • 我知道如何显示按钮并激活一些javascript来采取行动。
    但是如何创建这些分区（左、上、中、右），在运行时显示不同的按钮呢

    iframe可用于创建分区以显示html链接：--

    要使用HTML的哪些元素来实现这一点

    ===========================摘要=====================

    我需要做的页面布局。。。是的，开发人员很早就知道在左分区或中间分区中显示什么元素。。。他唯一不知道的是要在右侧分区上显示的链接元素，它将从远程服务器发送到Ui

    ===========================================图像=================

    我希望我没有误解您想要做什么（图像被代理阻止），但我要说的是，iFrame不是进行此类演示的最佳方式

    据我所知，您不需要提供这样的结构：

    +-------------------------------------+
| top                                 |
|                                     |
+--------------+----------------------+
|  left        |       right          |
|              |                      |
+--------------+----------------------+
    但是你不想在3帧之间与JS交互。 HTML5也可以，但iFrame更适合在内容中插入外部页面（来自另一个或同一个域）。 如果您只想分离不同的内容，那么这应该通过html元素和css表示来完成，但是所有内容都在同一个页面中

    例如，作为一个简单的例子，您可以使用以下简单结构：

    <html>
...
<body>
<header>Top</header>
<aside>left</aside>
<div id="content">right</div>
</body></html>

    
...
顶部

    

    正如昆廷所说，在选择HTML5元素作为容器之前，阅读文档了解它们的含义或选择一个通用元素（例如：div）。
    不要使用iFrame，它们仍然存在于HTML5中，但不是为了这个目的，你试图实现的目标在10年前是有效的，但你可以在谷歌上很快发现这是一个糟糕的做法，相反，您应该使用div作为布局或任何相关的html5标记（导航、标题、旁白等），使用ajax作为您想要的行为。>>使用ajax作为您想要的行为。。。。。这句话的确切意思是什么？我假设中间部分的消息是动态加载的，所有您不能也应该使用javascript执行的行为，如果您计划从服务器检索数据以填充其中一个部分，那么使用ajax可以异步获取该数据，如果所有信息都包含在静态页面上，那么就不需要ajax。这似乎是angular.js或backbone.js simple应用程序的一个很好的候选，但我只是想为您指出任何可能有助于您解决问题的方向=）在未阅读其规范并理解其含义的情况下，不要使用header等。它们不是指“应该在顶部或侧面呈现的任意内容”。实际上我知道它们的意思。这应该是页面基本布局的一个示例。根据元素的含义使用正确的元素是开发人员的责任，开发人员将更好地知道他将在每个元素中插入什么内容。我得到的印象是，Katoch不知道这一点。@Miam84是的，我需要制作页面布局。。。是的，开发人员很早就知道在左分区或中间分区中显示什么元素。。。他唯一不知道的是要在右侧分区上显示哪个链接元素，它将从远程服务器发送到Ui。要从远程服务器检索数据以替换初始内容，您需要ajax。这是一个由javascript完成的http请求，它将在不完全刷新页面的情况下为页面提供新内容。您可以从头开始编写整个JS来实现这一点，但正如Zarich所说，根据应用程序的不同，使用jQuery之类的框架或更复杂的应用程序angularjs、backbonejs等可能会很有趣，。。。正如您所说，您是html新手，我建议您使用