傳統的網站導航需要我們在是在頁面上弄超鏈接的方式來實現的,在頁面修改或移動的的時候需要壹壹在每個頁中都要進行修改,這樣會很麻煩。
在網站中建立網站地圖,也就是把所有的鏈接地址放在壹個專門的文件中進行統壹管理,這樣就很方面的進行管理。
怎麽弄網站導航?怎麽做?
需要在VS中新建網站地圖文件,再把網站地圖文件與我們想要的導航控件相關聯,這樣就可以實現導航的效果了,我們要更改某個地址,就直接在站點地圖.siteMap文件中更改就行了。
vs中如何添加網站地圖?
在vs中新建項中選擇"站點地圖"新建站點地圖。
要使用站點地圖,我們需要把站點地圖文件添加到網站根文件夾下。
在新建壹個站點地圖文件的時候,默認的代碼如下所示:
<?xml version="1.0"encoding="utf-8" ?>
<siteMapxmlns="/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="/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="/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="/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網站導航及導航控件的文章希望對大家的學習有所幫助。