</fieldset><fieldset>
    <legend> RSS 2.0  
        <form id="parser" onsubmit="return false">
          <label for="links"> Enter  rss 2.0 url  <br />
          <input type="text"id="links" name="links" class='jq-ui-forms'/>
            <input type="submit" class="button" value="Submit" onclick=" Rssparse ()"/>
     </ form>
</ fieldset>

输入和标签标记是经典的HTML标记，我们在其中添加了afui直接提供的类。 “ Rssparse（）”函数将在以后实现。

现在我们有了页面的第一部分，我们将必须创建显示RSS feed结果的部分。 我们希望以列表的形式显示RSS feed中的各种标题。 本节主要是动态创建的，但是我们必须做好准备。 以与表单相同的方式，将第二个字段集添加到现有的字段集。

<fieldset>
        <legend> Rss Feed 
            <ul id="flux">
            </ul>
</ fieldset>

我们添加了HTML标记“ ul”，因为我们的内容是标题列表。 App Framework将插入“ li”标记。

创建菜单

我们将为我们的应用程序创建一个菜单。 App Framework可以轻松创建两种类型的菜单。 第一个是应用程序底部的导航栏。 第二个是我们应用程序左侧的菜单。 第二个菜单始终在大屏幕上显示，但在小屏幕（智能手机）上可伸缩。 我们将创建第二种菜单。

首先，我们将从为应用程序创建第二页开始。 只需创建一个带有“ panel”类的第二个div。

<div title="Project" class="panel" id="test">

现在，我们将通过标签“ nav”添加菜单。 该标签应放置在#content之外。 菜单由afui自动创建。 类“标题”允许我们定义部分标题。 在afui中，应用程序内部页面之间的链接由其ID指定。 因此，我们的页面测试的调用将通过href =“＃test”进行。

<nav>
             <div class='title'> Business </div>
<ul>
             <li class="BusinessHome">
                     <a href="#rss"> Home </a>
             </li>
              <li >
                   <a href="#test"> test </a>
             </li>
</ul>
</nav >

请求和修改DOM

现在，我们有了GUI的基础，我们将实现内部功能并将其动态化。

选择器

第一步，当我们确认表单中的URL时，我们将恢复用户的操作。 创建此表单时，我们定义了提交按钮，如下所示：

<input type="submit" class="button" value="Submit" onclick=" Rssparse ()"/>

当用户单击提交按钮时， Rssparse()函数将被自动调用。 因此，我们需要实现它。 现在我们将转向JavaScript。 我们将在index.html文件末尾的结束标记“ / html”之后实现parserRss()函数。 最初，此功能将显示由用户验证的URL。

<script>
function Rssparse ()
{
alert ($ ("# link1").val ())
}

语法与jQuery相同。 这些选择器将使我们能够从其ID，其类或标签类型获取DOM的不同对象。

请记住，在创建表单的过程中，我们将分配给文本类型的输入，即id =链接。 通过调用选择器$（“＃link1”），返回的是包含用户输入的URL的输入文本。 选择此元素后，我们将调用val（）函数，该函数将向我们返回所选项目的值。 $（“＃link1”）.val（）返回用户输入的URL！

Ajax请求

与jQuery一样，App Framework可以发出Ajax请求。 由于浏览器的跨域限制，App Framework就像jQuery一样，不允许发出跨域Ajax请求。在我们的示例中，要从URL获取RSS feed，我们想在服务器上进行请求那不是我们的。 要发出此请求，我们将使用我们的代理（请参阅先决条件）。

function Rssparse ()
{
$. ajax ( {
url : ' ? server.php url =' + $ ("# link1" ).val ( ),
success : function ( data) {
alert (" ok");
},
error: function () {alert ("fail");}
} ) ;
}

在这里，我们在代理上发出一个中间请求，为他指定请求的真实URL。 然后，我们的代理将谨慎使用PHP发出请求并将结果发送给我们。

Xml解析器和DOM的动态修改

收集了xml数据后，我们现在必须处理它们。 App Framework为我们提供了一个名为parseXML的方法，该方法允许从xml文本构建DOM Document对象。 我们可以直接调用由parseXML函数产生的对象，例如getElementsByTagName之类的方法。

function Rssparse ()
{
$. ajax ( {
url : ' ? server.php url =' + $ ("# link" ) val ( ).
success : function ( data) {
var xmld = $.parseXML (data) ;
var nodes =xmld.getElementsByTagName ("item" ) ;
$("# flux" ).empty ();
 
for (i + + var i = 0 ; i < nodes.length )
{
var  titles= nodes[ i ].getElementsByTagName ("title" );
var dom = $ ("# flux" ).append (" <li> <a href=' ' >" + titles [0] childNodes [0]. nodeValue +"< / li >"...) ;
}
}
error: function () {alert ("fail");}
} ) ;
}

结论

App Framework提供了适用于移动设备的jQuery的大多数功能，其丰富的库和无与伦比的性能使其成为一个全面的移动HTML5框架。 该框架将允许您在很短的时间内构建移动应用程序。

您可以在http://app-framework-software.intel.com/documentation.php上找到文档。