ASP.NET网站导航及导航控件如何使用

前端技术 2023/09/03 .NET

网站导航？

传统的网站导航需要我们在是在页面上弄超链接的方式来实现的，在页面修改或移动的的时候需要一一在每个页中都要进行修改，这样会很麻烦。
在网站中建立网站地图，也就是把所有的链接地址放在一个专门的文件中进行统一管理，这样就很方面的进行管理。
怎么弄网站导航？怎么做？

需要在VS中新建网站地图文件，再把网站地图文件与我们想要的导航控件相关联，这样就可以实现导航的效果了，我们要更改某个地址，就直接在站点地图.siteMap文件中更改就行了。
vs中如何添加网站地图？

在vs中新建项中选择\"站点地图\"新建站点地图。
要使用站点地图，我们需要把站点地图文件添加到网站根文件夹下。
在新建一个站点地图文件的时候，默认的代码如下所示：

<?xml version=\"1.0\"encoding=\"utf-8\" ?>
<siteMapxmlns=\"http://schemas.microsoft.com/AspNet/SiteMap-File-1.0\" >
  <siteMapNodeurl=\"\" title=\"\" description=\"\">
    <siteMapNodeurl=\"\"title=\"\" description=\"\" />
    <siteMapNodeurl=\"\"title=\"\" description=\"\" />
  </siteMapNode>
</siteMap>

我们可以从代码中看出文件的根元素siteMap包含了<siteMapNode>元素，这些<siteMapNode>元素形成树形结构，第一层为网站的主页。
<siteMapNode>元素常用的属性表。

复杂的导航为了更能清晰的显示，我们可以多用几个.mapMap文件，也就是嵌套网站地图。
我们在新建一个文件夹，在这个文件夹下建两个网站地图文件，Products.siteMap和Servers.sitMap，建立Web.siteMap放到网站的根目录下，用web.site的siteMapFile属性来链接其他两个.siteMap文件。 代码如下所示：
Products.siteMap:

<?xml version=\"1.0\"encoding=\"utf-8\" ?> 
<siteMap xmlns=\"http://schemas.microsoft.com/AspNet/SiteMap-File-1.0\" > 
  <siteMapNode title=\"Products\" description=\"我们的产品\" 
        url=\"~/chap/Products.aspx\"> 
    <siteMapNode url=\"~/chap/Software.aspx\"title=\"软件\" description=\"软件的提供\" />  
    <siteMapNode url=\"~/chap/Hardware.aspx\"title=\"硬件\" description=\"硬件的提供\" />  
  </siteMapNode>  
</siteMap>  
Services.siteMap文件：  
<?xml version=\"1.0\"encoding=\"utf-8\" ?>  
<siteMap xmlns=\"http://schemas.microsoft.com/AspNet/SiteMap-File-1.0\" >  
  <siteMapNodeurlsiteMapNodeurl=\"~/chap/Services.aspx\"title=\"Services\" description=\"我们提供的服务\"> 
     <siteMapNode url=\"~/chap/Training.aspx\"title=\"训练\" description=\"训练\" /> 
     <siteMapNode url=\"~/chap/Consulting.aspx\"title=\"咨询\" description=\"问题咨询\" /> 
     <siteMapNode url=\"~/chap/Support.aspx\"title=\"支持\" description=\"技术支持\" />  
  </siteMapNode>  
</siteMap>

Web.siteMap文件：

<?xml version=\"1.0\"encoding=\"utf-8\" ?> 
<siteMap xmlns=\"http://schemas.microsoft.com/AspNet/SiteMap-File-1.0\" >  
  <siteMapNodeurlsiteMapNodeurl=\"home.aspx\" title=\"home\" description=\"home\"> 
    <siteMapNode siteMapFile=\"~/chap/Products.sitemap\" /> 
    <siteMapNodesiteMapFilesiteMapNodesiteMapFile=\"~/chap/Services.sitemap\" />  
  </siteMapNode>  
</siteMap>

导航地图建立完了，接下来显示导航地图。
SiteMapPath控件显示导航

直接把控件拖动到要导航的页面就可以了。控件会自动与导航地图进行绑定。
显示：

TreeView控件显示导航

TreeView控件通常用来树形结构的站点导航，可以用来显示XML、表格或关系数据。
基本的操作：
TreeView每个节点其实都一个是个TreeNode类的对象。可以通过编程操作TreeNode对象动态的添加和修改。可以通过数据源控件进行绑定，例如通过SiteMapDataSource空调感觉爱你或XmlDataSource控件。
TreeViewcollapseAll()和ExpandAll()方法折叠和展开节点。利用Nodes.Add()方法添加到节点到控件中，Nodes.Remove()方法删除指定节点。
DEMO：

在这里只是为了熟悉TreeView，也没有实现，鼠标右击对TreeView操作，和只刷新TreeView控件，以及和数据绑定。只是为了熟悉TreeView而熟悉TreeView。
myTreeView代码：

<%@ PageLanguage=\"C#\" AutoEventWireup=\"true\"CodeFile=\"Menu.aspx.cs\"Inherits=\"Menu\" %>  
<!DOCTYPE html PUBLIC \"-//W3C//DTDXHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\"> 
<html xmlns=\"http://www.w3.org/1999/xhtml\">  
<head runat=\"server\">  
  <title></title>  
</head>  
<body>  
  <formidformid=\"form1\" runat=\"server\"> 
  <div>     
  </div>  
  <asp:Menu ID=\"Menu1\" runat=\"server\"> 
    <Items> 
      <asp:MenuItem Text=\"米老师\" Value=\"米老师\"></asp:MenuItem> 
      <asp:MenuItem Text=\"七期\" Value=\"七期\"> 
      <asp:MenuItem Text=\"师姐一\" Value=\"师姐一\"></asp:MenuItem> 
      <asp:MenuItem Text=\"师姐二\" Value=\"师姐二\"></asp:MenuItem> 
      </asp:MenuItem>  
      <asp:MenuItem Text=\"八期\" Value=\"八期\"> 
      <asp:MenuItem Text=\"英语部\" Value=\"英语部\"></asp:MenuItem> 
      <asp:MenuItem Text=\"值日生部门\" Value=\"值日生部门\"></asp:MenuItem> 
      </asp:MenuItem> 
      <asp:MenuItem Text=\"九期\" Value=\"九期\"></asp:MenuItem> 
      <asp:MenuItem Text=\"十期\" Value=\"十期\"></asp:MenuItem> 
      <asp:MenuItem Text=\"十一期\" Value=\"十一期\"></asp:MenuItem> 
    </Items> 
   </asp:Menu> 
  </form> 
 </body> 
</html>

 C#代码：

public partial class chap_myTreeView: System.Web.UI.Page  
{ 
  //移除当前节点  
  protectedvoid RemoveNode_Click(object sender, EventArgs e) 
   { 
     //如果存在当前节点。 
     if (myTreeView.SelectedNode !=null) 
    {     
      //获取当前节点的父节点。 
      TreeNode parentNode= myTreeView.SelectedNode.Parent; 
      //移除当前节点。 
      if (parentNode !=null) 
      { parentNode.ChildNodes.Remove(myTreeView.SelectedNode); } 
       else 
      { 
         myTreeView.Nodes.Remove(myTreeView.SelectedNode);  
      } 
    } 
  } 
   //添加当前节点。 
  protectedvoid AddNode_Click(object sender, EventArgse)  
  { 
     //如果添加当前节点的值为空，则返回。 
 
    if (txtAdd.Text.Trim().Length <1) 
    { 
       return; 
    } 
     //建立节点的childNode，设置Value属性。 
     TreeNode chileNode = new TreeNode(); 
    //给新加的节点赋值。 
    chileNode.Value = txtAdd.Text.Trim(); 
    //判断是否选中一个节点。 
    if (myTreeView.SelectedNode !=null)//如果存在当前节点。 
    { 
       //将新的childNode对象添加到当前节点。 
      myTreeView.SelectedNode.ChildNodes.Add(chileNode); 
      txtAdd.Text = \"\"; 
    } 
    else 
     { 
      //作为根节点添加到树中。 
      myTreeView.Nodes.Add(chileNode); 
      //清楚文本框。 
     txtAdd.Text = \"\"; 
    }  
  }  
  //将树全部的折叠。 
  protectedvoid FlodNodes_Click(object sender, EventArgs e)  
  { 
     myTreeView.CollapseAll();//将树全部折叠起来. 
  } 
   //全部展开. 
  protectedvoid OpenAllNode_Click(object sender, EventArgs e) 
  { 
    myTreeView.ExpandAll();//全部展开树.  
  } 
}

效果：

 

Menu控件和TreeView大同小异，在这就不赘述了。
        Word中的导航让我们一目了然的了解到文章的主体内容，我想每个看过厚厚文档的程序员对word的导航都深有体会。清晰合理的导航有效引导用户到网站的各个角落，百度地图能让我们找到每一块有名字的土地。一篇文章上说过，SEO行业里总流传着这么句经典话语：“内容为王，外链为皇，内链为妃，关键词为相，代码为将，结构为城，更新为太子，百度垂帘听政。那导航不就是链接地址，也就处在皇妃的位置了。。。。

希望这篇关于ASP.NET网站导航及导航控件的文章希望对大家的学习有所帮助。

本文地址：https://www.stayed.cn/item/7655

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见，何事秋风悲画扇。

我的标签

随笔档案