第10章 网站导航控件
[多选题]导航控件包括()。
![[多选题]导航控件包括()。](https://img.taocdn.com/s3/m/4a40616cec630b1c59eef8c75fbfc77da26997bc.png)
[多选题]导航控件包括()。
摘要：
1.导航控件的定义与作用
2.导航控件的分类
3.常见导航控件的功能与特点
4.导航控件在现代科技中的应用
5.导航控件的未来发展趋势
正文：
导航控件是指用于控制和指引用户在特定场景下进行操作的控件，例如网页上的地址栏、地图上的缩放按钮等。
它们在现代科技中无处不在，为用户提供了方便快捷的操控方式。
导航控件可以分为多种类型，常见的有以下几种：
1.地址栏：通常出现在网页上，用于显示当前访问的网址，用户可以通过输入关键词或网址进行搜索或访问指定网页。
2.缩放按钮：常见于地图应用中，用户可以通过点击缩放按钮放大或缩小地图视图。
3.滚动条：在较长的页面或文档中，用户可以通过滚动条进行上下浏览。
4.导航栏：通常出现在网页或应用的顶部或底部，包含一系列功能入口，如首页、产品、关于我们等，方便用户快速切换和了解应用的功能。
这些导航控件各具特点，为用户提供了简单易用的操作体验。
例如，地址栏可以让用户快速切换网页，缩放按钮可以让用户自由调整地图视图，滚动条则可以让用户浏览长篇文档时更加方便。
随着科技的不断发展，导航控件也在不断演进。
例如，随着人工智能技术的发展，未来导航控件可能会更加智能化，能够根据用户的使用习惯和需求自动调整。
此外，随着语音识别和手势操作等技术的发展，导航控件的操作方式也可能会更加多样化。
总的来说，导航控件在现代科技中发挥着重要的作用，它们不仅方便了用户的操作，也为科技的发展提供了重要的支持。
站点导航控件
站点导航控件站点地图概述通常情况下。
在Web站点中应为用户提供站点导航。
常见的站点导航空间有：SiteMapPath、TreeView、Menu等。
实现站点导航功能主要涉及连个方面内容：站点导航控件和站点地图。
站点地图是一种扩展名为.sitemap的标准XML文件，其中包括了站点结构信息。
默认情况下站点地图文件被命名为Web.sitemap，必须存储在网站的根目录下。
SiteMapPathSiteMapPath控件能够根据站点导航信息，准确定位当前网页所处整个站点的位置，同时使用层次化的表示方法，将位置信息显示为有序的静态文本或者超级连接。
另外，通过调整相关属性，可以自定义位置信息的外观以及其他内容，从而适应网站的总体设计风格。
SiteMapPath控件由多个节点组成，节点可分为以下3种类型：根节点、父节点和当前常用的事件典型示例使用前面已经创建的站点地图，实现页面导航例ex_sitemappathTreeV iewTreeV iew控件在客户端浏览器中会显示一个树形结构，此树与Windows中的资源管理器中的树非常类似。
该控件主要用来显示分级数据，例如，目录结构数据，多层表结构数据等。
以下列出TreeView的功能特征：支持数据绑定。
允许通过数据绑定的方式，使控件节点与XML、表格、关系型数据等结构化数据建立紧密地联系支持站点导航功能。
通过集成SiteMapDataSource控件，实现站点导航功能节点文字可显示为普通文本或超连接文本支持动态构建功能。
通过编程方式访问TreeView对象模型，完成动态创建树形结构，构建节点和设置属性等任务在客户端浏览器支持的情况下，支持由客户端构建节点，以减少到服务器端的回送具有在节点显示CheckBox控件的功能可自定义树形和节点的样式、主题等外观特征可根据不同类型设备和浏览器，自适应地完成控件呈现TreeV iew由多个TreeNode对象组成，每个TreeNode还可以包含多个子TreeNode对象。
网站导航（Menu控件）
⽹站导航（Menu控件）Menu 是另⼀个⽀持层次化数据的富控件。
它可以绑定到数据源（声明性的）或编程使⽤ MenuItem 对象来填充。
MenuItem 类不像 TreeNode 类那样丰富，它不⽀持复选框，也不能通过编程设置它们的折叠/展开状态。
不过，它们也有很多相似的属性，包括那些⽤于设置图⽚、确定条⽬是否可选以及指定⽬标链接的属性。
MenuItem 的属性：Text菜单中显⽰的⽂字TooTip⿏标停留菜单项时的提⽰⽂字Value保存不显⽰的额外数据（⽐如某些程序需要⽤到的 ID）NavigateUrl如果设置了值，单击节点会前进⾄此 Url。
否则，需要响应Menu.MenuItemClick事件确定要执⾏的活动Target它设置了链接的⽬标窗⼝或框架。
Menu ⾃⾝也暴露了 Target 属性设置所有的 MenuItem 实例的默认⽬标Selectable如果为 false，菜单项不可选。
通常只在菜单项有⼀些可选的⼦菜单项时，才设为 falseImageUrl菜单项旁边的图⽚PopOutImageUrl菜单项包含⼦项时现在在菜单项旁的图⽚，默认是⼀个⼩的实⼼箭头SeparatorImageUrl菜单项下⾯显⽰的图⽚，⽤于分隔菜单项和遍历 TreeView 结构的⽅式相同，Menu 控件仅做很⼩的改动，⼏乎就可以重⽤先前 TreeView 的代码：protected void Page_Load(object sender, EventArgs e){if (!Page.IsPostBack){DataSet ds = GetProductsAndCategories();foreach (DataRow row in ds.Tables["Categories"].Rows){MenuItem itemCategory = new MenuItem(row["CategoryName"].ToString(),row["CategoryID"].ToString());Menu1.Items.Add(itemCategory);DataRow[] childRows = row.GetChildRows(ds.Relations["CatProds"]);foreach (DataRow childRow in childRows){MenuItem itemProduct = new MenuItem(childRow["ProductName"].ToString(),childRow["ProductID"].ToString());itemCategory.ChildItems.Add(itemProduct);}}}}protected void Menu1_MenuItemClick(object sender, MenuEventArgs e){if (Menu1.SelectedItem.Depth == 0){lblInfo.Text = "You selected Category ID: ";}else if (Menu1.SelectedItem.Depth == 1){lblInfo.Text = "You selected Product ID: ";}lblInfo.Text += Menu1.SelectedItem.Value;}虽然 Menu 和 TreeView 的呈现⽅式⾮常不同，但它们暴露了⾮常相似的编程模型。
第7章网站导航控件
第7章网站导航控件
7.2 站点地图
站点地图是一种以.sitemap为扩展名的标准XML文件，主要为站点导航控件提供站 点层次结构信息，默认名为Web.sitemap。
编程控件。可以以代码方式使用站点导航，以创 建自定义导航控件或修改在导航菜单中显示的信息的位置 。
访问规则。可以配置用于在导航菜单中显示或隐藏链接的 访问规则。
自定义站点地图提供程序。可以创建自定义站点地图提供 程序，以便使用自己的站点地图后端（如存储链接信息的 数据库），并将提供程序插入到站点导航系统。
② ①
“添加新项”对话框
web.sitemap站点地 图
第7章网站导航控件
站点地图是一个标准XML文件。其中，第一个标记用于标识版本和编码方式， siteMap是站点地图根节点标记，包含若干个siteMapNode子节点，一个 siteMapNode子节点下又可以包含若干个siteMapNode子节点，构成一种层次结构 。
站点导航。站点导航提供下列功能：
站点地图。可以使用站点地图描述站点的逻辑结构 。接着通过在添加或移除页面时修改站点地图（而 不是修改所有网页的超链接）来管理页导航。
导航控件。可以使用控件在网页上 显示导航菜单。导航菜单以站点地图为基础。
第7章网站导航控件
ValueP复选框是否被选中 获取TreeNodeCollection集合，该集合包含当前节点的第一级子节点 获取节点的深度
获取或设置一个值，该值指示是否展开节点 获取或设置在节点旁边显示的图像的工具提示文本 获取或设置节点旁显示的图像的URL 获取或设置单击节点时导航到的URL 获取当前节点的父节点 获取或设置一个值，该值指示是否选择节点 获取或设置一个值，该值指示是否在节点旁显示一个复选框 获取或设置用来显示与节点关联的网页内容的目标窗口或框架 获取或设置为TreeView控件中的节点显示的文本 获取或设置节点的工具提示文本 获取或设置用于存储有关节点的任何其他数据（如用于处理回发事 件的数据）的非显示值 获取从根节点到当前节点的路径
网站导航
1. 2. 3. 4. 5.
Menu控件
1. 2. 3. 4. 5. Menu控件以菜单的结构形式来对网站进行导航，可以采用水平方向或竖直方 向的形式导航，它支持以下功能： 通过与SiteMapDataSource控件集成提供对站点导航的支持。 可以显示为可选择文本或超链接的节点文本。 通过编程访问Menu对象模型，使程序员可以动态地创建菜单，填充菜单项以 及设置属性等。 能够采用水平方向或竖直方向的形式导航。 支持静态或动态的显示模式。
网站地图
把站点文件绑定到页面
(1)确定Web.sitemap文件列举的页面都已经存在 于网站项目中， (2)在页面上添加一个SiteMapDataSource控件。 (3)最后，添加一个绑定到SiteMapDataSource 控件的导航控件。设置导航的控件的属性 DataSourceID为SiteMapDataSource控件的ID。
Menu控件
Menu控件由菜单项(由MenuItem对象表示)树组成。顶级(级别0)菜 单项称为根菜单项。具有父菜单项的菜单项称为子菜单项。所有根菜 单项都存储在Items集合中。子菜单项存储在父菜单项的ChildItems 集合中。 每个菜单项都具有Text属性和Value属性。Text属性的值显示在 Menu控件中，而Value 属性则用于存储菜单项的任何其他数据(如传 递给与菜单项关联的回发事件的数据)。在单击时，菜单项可导航到 NavigateUrl属性指示的另一个网页。
网站地图
提供了名为XmlSiteMapProvider的网 站地图提供器，使用XmlSiteMapProvider可以从 XML文件中获取网站地图信息。 XmlSiteMapProvider会从根目录中寻找名为 Web.sitemap的文件来读取信息，它解析了 Web.sitemap文件中的网站地图数据后创建一个 Web.sitemap 网站地图对象，而这个网站地图对象能够被 SiteMapDataSource所使用，而 SiteMapDataSource可以被放置在页面的导航控 件所使用，最后由导航控件把网站的导航信息显示 在页面上。
网站建设-网站导航控件
xml 格式
• <?xml version="1.0" encoding="utf-8" ?> encoding="utf• <siteRoot id="root" url="" title="管理员控制面板" description=""> title="管理员控制面板 管理员控制面板" • title="管理员信息 管理员信息" <siteMapNode url="" title="管理员信息" description=""> • url="~\Admin\ title="管理员列表 管理员列表" <siteMapNode url="~\Admin\AdminList.aspx" title="管理员列表" • • • • • • • • • • • •
TreeView控件 TreeView控件
• 此控件显示一个树状结构或
菜单， 菜单，让用户可以遍历访问 站点中的不同页面。 站点中的不同页面。单击包 含子节点的节点可将其展开 或折叠。 或折叠。
站点地图
• 要使用 站点导航，必须描述站点结 站点导航，
构。默认情况下，站点导航系统使用一个包 默认情况下， 文件。 含站点层次结构的 XML 文件。 • 创建站点地图最简单方法是创建一个名为 文件， Web.sitemap 的 XML 文件，该文件按站点的 分层形式组织页面。 分层形式组织页面。 的默认站点地 图提供程序自动选取此站点地图。当然， 图提供程序自动选取此站点地图。当然，也 可以自定义格式。 可以自定义格式。
导航控件》SiteMapPath、TreeView、Menu.12.17
导航控件》SiteMapPath、TreeView、Menu.12.17在Web应⽤中，导航是⾮常重要的。
提供了站点导航的⼀种简单的⽅法，即使⽤站点图形站点导航控件SiteMapPath、TreeView、Menu等控件。
导航控件包括SiteMapPath、TreeView、Menu三个控件，这三个控件都可以在页⾯中轻松建⽴导航。
这三个导航控件的基本特征如下所⽰：１）SiteMapPath：检索⽤户当前页⾯并显⽰层次结构的控件。
这使⽤户可以导航回到层次结构中的其他页。
SiteMap控件专门与SiteMapProvider⼀起使⽤。
２）TreeView：提供纵向⽤户界⾯以展开和折叠⽹页上的选定节点，以及为选定像提供复选框功能。
并且TreeView控件⽀持数据绑定。
３）Menu：提供在⽤户将⿏标指针悬停在某⼀项时弹出附加⼦菜单的⽔平或垂直⽤户界⾯。
这三个导航控件都能够快速的建⽴导航，并且能够调整相应的属性为导航控件进⾏⾃定义。
SiteMapPath控件使⽤户能够从当前导航回站点层次结构中较⾼的页，但是该控件并不允许⽤户从当前页⾯向前导航到层次结构中较深的其他页⾯。
相⽐之下，使⽤TreeView或Menu控件，⽤户可以打开节点并直接选择需要跳转的特定页。
这些控件不会像SiteMapPath控件⼀样直接读取站点地图。
TreeView和Menu控件不仅可以⾃定义选项，也可以绑定⼀个SiteMapDataSource。
TreeView和Menu控件的基本样式如图5-60和图5-61所⽰。
TreeView和Menu控件⽣成的代码并不相同，因为TreeView和Menu控件所实现的功能也不尽相同。
TreeView和Menu控件的代码分别如下所⽰。
-HTML<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><asp:MenuItem Text="新建项" Value="新建项"><asp:MenuItem Text="新建项" Value="新建项"></asp:MenuItem></asp:MenuItem><asp:MenuItem Text="新建项"Value="新建项"><asp:MenuItem Text="新建项" Value="新建项"><asp:MenuItem Text="新建项" Value="新建项"></asp:MenuItem></asp:MenuItem></asp:MenuItem><asp:MenuItem Text="新建项" Value="新建项"></asp:MenuItem></Items></asp:Menu> 上述代码声明了⼀个Menu控件，并添加了若⼲节点。
第7章网站导航控件
，并将导航数据传递到可显示该数据的控件（如TreeView和Menu控件）。
第7章网站导航控件
3. 通过编程方式添加节点 由于TreeView控件的Nodes属性是一个TreeNodeCollection类对象，因此采用
Add方法向其中添加TreeNode对象。这种方式在可以在运行时动态地增删TreeView 控件的节点。
该属性获取或设置第一次显示TreeView控件时所展开的层次数。例如， 若该属性设为2，则将展开根节点及根节点下方紧邻的所有子节点。
第7章网站导航控件
（3）SelectedNode属性 该属性返回用户从TreeView控件中选定的一个TreeNode对象。例如，以下语
句在标签Label1中显示选择节点的文本：
第7章网站导航控件
7.3.2 TreeView控件的属性、方法和事件 1. TreeView控件的属性 （1）DataSourceID属性
该属性指定TreeView控件的数据源控件的ID属性。例如，可以指定与 XML文件绑定的XmlDataSource控件或与站点地图绑定的SiteDataSource控 件的ID。 （2）ExpandDepth属性
siteMapNode节点的常用属性如下表所示：
属性 url
title description key roles
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
10.1.1 站点导航的功能
站点导航提供下列功能：
可以使用站点地图描述站点的逻辑结构。
可以使用导航控件在网页上显示导航菜单。 可以以代码方式创建自定义导航控件或修改在导航菜单
中显示的信息的位置。
可以配置用于在导航菜单中显示或隐藏链接的访问规则。 可以创建自定义站点地图提供程序。
3. 通过编程方式添加节点
由于TreeView控件的Nodes属性是一个TreeNodeCollection 类对象，因此采用Add方法向其中添加TreeNode对象。这种方 式在可以在运行时动态地增删TreeView控件的节点。
TreeNodeExpanded
TreeNodePopulate
当扩展TreeView控件中的节点时发生
当其PopulateOnDemand属性设置为true的节点在 TreeView控件中展开时发生
10.3.3 TreeNodeCollection类
TreeView控件中所有节点构成一个TreeNodeCollection
类对象，也就是说，TreeView控件的Nodes属性就是一个 TreeNodeCollection类对象。
属性
Count Collection对象中的项数 获取TreeNodeCollection对象中指定索引处的TreeNode对象
TreeNodeCollection类的主要方法有Add、AddAt、 Clear、Contains、IndexOf、Remove、RemoveAt。
10.3.4 向TreeView控件中添加节点的方法
1. 手工方式添加节点
2. 通过DataSourceID属性置数据源控件
提供了SiteMapDataSource和XmlDataSource两个
服务器控件，位于工具箱的“数据”选项卡中，用于
站点导航。 前者检索站点地图提供程序的导航数据，后者检索指定的 XML文件的导航数据，并将导航数据传递到可显示该数据的控 件（如TreeView和Menu控件）。
TreeView1.Nodes[0]表示TreeView1控件中第一个根节点。 TreeView1.Nodes[0].ChildNodes表示TreeView1控件中第一个根节点
的子节点集合。
TreeView1.Nodes[0].ChildNodes[1]表示TreeView1控件中第一个根节 点的第2个子节点。
站点地图是一个标准XML文件。其中，第一个标记用于标识版 本和编码方式，siteMap是站点地图根节点标记，包含若干个 siteMapNode子节点，一个siteMapNode子节点下又可以包含若干个 siteMapNode子节点，构成一种层次结构。 siteMapNode节点的常用属性如下表所示：
navigateUrl,string target)
10.3.2 TreeView控件的属性、方法和事件
1. TreeView控件的属性
（1）DataSourceID属性
该属性指定TreeView控件的数据源控件的ID属性。例如， 可以指定与XML文件绑定的XmlDataSource控件或与站点地 图绑定的SiteDataSource控件的ID。
站点地图是一种以.sitemap为扩展名的标准XML文件，
主要为站点导航控件提供站点层次结构信息，默认名为 Web.sitemap。
【例10.1】 在D盘目录中建立一个ch10的子目录， 将其作为网站目录，创建一个表示前面所列的大学网站层次
结构的站点地图。
解：其设计步骤如下：
① 启动Visual Studio 2012。 ② 选择“文件|新建|网站”命令，出现“新建网站”对话框，选择 “空网站”模板，选择“Web位置”为“文件系统”，单击 “浏览”按钮，选择“D:\\ch10”目录，单击“确定”按钮，创 建了一个空的网站ch10。
方法 Collapse CollapseAll Expand ExpandAll Select ToggleExpandState
说明 折叠当前树节点 折叠当前节点及其所有子节点 展开当前树节点 展开当前节点及其所有子节点 选择TreeView控件中的当前节点 切换节点的展开和折叠状态
TreeNode类提供了以下构造函数：
10.1.2 站点导航的工作方式
通过站点导航，可以按层次结构描述站点的布 局。例如，一个大学网站共有11页，其布局如下：
中华大学 院系设置 计算机学院 电子信息学院 数学学院 物理学院 职能部门 教务处 财务处 学生工作处 科技处
10.1.3 站点导航控件
TreeView：此控件显示一个树状结构或菜单，让用户可以遍 历访问站点中的不同页面。单击包含子节点的节点可将其展 开或折叠。 Menu：此控件显示一个可展开的菜单，让用户可以遍历访 问站点中的不同页面。将光标悬停在菜单上时，将展开包含 子节点的节点。 SiteMapPath：此控件显示导航路径（也称为面包屑或眉毛 链接）向用户显示当前页面的位置，并以链接的形式显示返 回主页的路径。此控件提供了许多可供自定义链接的外观的 选项。
2. TreeView控件的方法
方法 ExpandAll FindNode 说明 打开树中的每个节点 检索TreeView控件中指定值路径处的TreeNode对象
3. TreeView控件的事件
事件 SelectedNodeChanged 说明 当选择TreeView控件中的节点时发生
TreeNodeCheckChanged 当TreeView控件中的复选框在向服务器的两次发送 过程之间状态有所更改时发生。 TreeNodeCollapsed TreeNodeDataBound 当折叠TreeView控件中的节点时发生 当数据项绑定到TreeView控件中的节点时发生
public TreeNode()
public TreeNode (string text)
public TreeNode (string text,string value) public TreeNode (string text,string value,string imageUrl)
public TreeNode (string text,string value,string imageUrl,string
③ 选择“网站|添加新项”菜单命令，出现“添加新项-ch10”对话框，
在中间列表中选择“站点地图”模板，保持默认名称为web.sitemap（只有
名称为web.sitemap的站点地图才会被自动加载，并且必须出现在网站的根 目录中），如图10.2所示。单击“添加”按钮。
④ 出现站点地图的编辑窗口，编辑该站点地图包含的内容如下：
（2）ExpandDepth属性
该属性获取或设置第一次显示TreeView控件时所展开的 层次数。例如，若该属性设为2，则将展开根节点及根节点下 方紧邻的所有子节点。
（3）SelectedNode属性
该属性返回用户从TreeView控件中选定的一个TreeNode
对象。例如，以下语句在标签Label1中显示选择节点的文本：
一个节点可以同时是父节点和子节点，但是不能同时为根