ASP.NET網(wǎng)站導(dǎo)航及導(dǎo)航控件如何使用
網(wǎng)站導(dǎo)航?
傳統(tǒng)的網(wǎng)站導(dǎo)航需要我們?cè)谑窃陧撁嫔吓溄拥姆绞絹韺?shí)現(xiàn)的,在頁面修改或移動(dòng)的的時(shí)候需要一一在每個(gè)頁中都要進(jìn)行修改,這樣會(huì)很麻煩。
在網(wǎng)站中建立網(wǎng)站地圖,也就是把所有的鏈接地址放在一個(gè)專門的文件中進(jìn)行統(tǒng)一管理,這樣就很方面的進(jìn)行管理。
怎么弄網(wǎng)站導(dǎo)航?怎么做?
需要在VS中新建網(wǎng)站地圖文件,再把網(wǎng)站地圖文件與我們想要的導(dǎo)航控件相關(guān)聯(lián),這樣就可以實(shí)現(xiàn)導(dǎo)航的效果了,我們要更改某個(gè)地址,就直接在站點(diǎn)地圖.siteMap文件中更改就行了。
vs中如何添加網(wǎng)站地圖?
在vs中新建項(xiàng)中選擇"站點(diǎn)地圖"新建站點(diǎn)地圖。
要使用站點(diǎn)地圖,我們需要把站點(diǎn)地圖文件添加到網(wǎng)站根文件夾下。
在新建一個(gè)站點(diǎn)地圖文件的時(shí)候,默認(rèn)的代碼如下所示:
<?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>元素形成樹形結(jié)構(gòu),第一層為網(wǎng)站的主頁。
<siteMapNode>元素常用的屬性表。
復(fù)雜的導(dǎo)航為了更能清晰的顯示,我們可以多用幾個(gè).mapMap文件,也就是嵌套網(wǎng)站地圖。
我們?cè)谛陆ㄒ粋€(gè)文件夾,在這個(gè)文件夾下建兩個(gè)網(wǎng)站地圖文件,Products.siteMap和Servers.sitMap,建立Web.siteMap放到網(wǎng)站的根目錄下,用web.site的siteMapFile屬性來鏈接其他兩個(gè).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="我們的產(chǎn)品" 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="我們提供的服務(wù)"> <siteMapNode url="~/chap/Training.aspx"title="訓(xùn)練" description="訓(xùn)練" /> <siteMapNode url="~/chap/Consulting.aspx"title="咨詢" description="問題咨詢" /> <siteMapNode url="~/chap/Support.aspx"title="支持" description="技術(shù)支持" /> </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>
導(dǎo)航地圖建立完了,接下來顯示導(dǎo)航地圖。
SiteMapPath控件顯示導(dǎo)航
直接把控件拖動(dòng)到要導(dǎo)航的頁面就可以了??丶?huì)自動(dòng)與導(dǎo)航地圖進(jìn)行綁定。
顯示:
TreeView控件顯示導(dǎo)航
TreeView控件通常用來樹形結(jié)構(gòu)的站點(diǎn)導(dǎo)航,可以用來顯示XML、表格或關(guān)系數(shù)據(jù)。
基本的操作:
TreeView每個(gè)節(jié)點(diǎn)其實(shí)都一個(gè)是個(gè)TreeNode類的對(duì)象。可以通過編程操作TreeNode對(duì)象動(dòng)態(tài)的添加和修改??梢酝ㄟ^數(shù)據(jù)源控件進(jìn)行綁定,例如通過SiteMapDataSource空調(diào)感覺愛你或XmlDataSource控件。
TreeViewcollapseAll()和ExpandAll()方法折疊和展開節(jié)點(diǎn)。利用Nodes.Add()方法添加到節(jié)點(diǎn)到控件中,Nodes.Remove()方法刪除指定節(jié)點(diǎn)。
DEMO:
在這里只是為了熟悉TreeView,也沒有實(shí)現(xiàn),鼠標(biāo)右擊對(duì)TreeView操作,和只刷新TreeView控件,以及和數(shù)據(jù)綁定。只是為了熟悉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 { //移除當(dāng)前節(jié)點(diǎn) protectedvoid RemoveNode_Click(object sender, EventArgs e) { //如果存在當(dāng)前節(jié)點(diǎn)。 if (myTreeView.SelectedNode !=null) { //獲取當(dāng)前節(jié)點(diǎn)的父節(jié)點(diǎn)。 TreeNode parentNode= myTreeView.SelectedNode.Parent; //移除當(dāng)前節(jié)點(diǎn)。 if (parentNode !=null) { parentNode.ChildNodes.Remove(myTreeView.SelectedNode); } else { myTreeView.Nodes.Remove(myTreeView.SelectedNode); } } } //添加當(dāng)前節(jié)點(diǎn)。 protectedvoid AddNode_Click(object sender, EventArgse) { //如果添加當(dāng)前節(jié)點(diǎn)的值為空,則返回。 if (txtAdd.Text.Trim().Length <1) { return; } //建立節(jié)點(diǎn)的childNode,設(shè)置Value屬性。 TreeNode chileNode = new TreeNode(); //給新加的節(jié)點(diǎn)賦值。 chileNode.Value = txtAdd.Text.Trim(); //判斷是否選中一個(gè)節(jié)點(diǎn)。 if (myTreeView.SelectedNode !=null)//如果存在當(dāng)前節(jié)點(diǎn)。 { //將新的childNode對(duì)象添加到當(dāng)前節(jié)點(diǎn)。 myTreeView.SelectedNode.ChildNodes.Add(chileNode); txtAdd.Text = ""; } else { //作為根節(jié)點(diǎn)添加到樹中。 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中的導(dǎo)航讓我們一目了然的了解到文章的主體內(nèi)容,我想每個(gè)看過厚厚文檔的程序員對(duì)word的導(dǎo)航都深有體會(huì)。清晰合理的導(dǎo)航有效引導(dǎo)用戶到網(wǎng)站的各個(gè)角落,百度地圖能讓我們找到每一塊有名字的土地。一篇文章上說過,SEO行業(yè)里總流傳著這么句經(jīng)典話語:“內(nèi)容為王,外鏈為皇,內(nèi)鏈為妃,關(guān)鍵詞為相,代碼為將,結(jié)構(gòu)為城,更新為太子,百度垂簾聽政。那導(dǎo)航不就是鏈接地址,也就處在皇妃的位置了。。。。
希望這篇關(guān)于ASP.NET網(wǎng)站導(dǎo)航及導(dǎo)航控件的文章希望對(duì)大家的學(xué)習(xí)有所幫助。
相關(guān)文章
asp.net SqlParameter關(guān)于Like的傳參數(shù)無效問題
用傳參方式模糊查詢searchName2009-06-06看到本質(zhì)而不是現(xiàn)象--解決ASP.NET CS0016的問題
看到本質(zhì)而不是現(xiàn)象--解決ASP.NET CS0016的問題...2007-01-01asp.net Repeater 數(shù)據(jù)綁定的具體實(shí)現(xiàn)(圖文詳解)
此例子綁定的數(shù)據(jù)源為微軟在mssql2000中提供的Northwind數(shù)據(jù)庫中的表Categories。2013-07-07asp.net Server.MapPath方法注意事項(xiàng)
當(dāng)我發(fā)布之后,對(duì)存儲(chǔ)圖片的文件夾創(chuàng)建了虛擬目錄,并賦予該目錄寫入的權(quán)限,但是,當(dāng)我上傳圖片的時(shí)候,總是失敗。以前沒遇到過這種情況,覺得很是怪異,所以想盡辦法去解決。2008-09-09解決asp.net Sharepoint無法連接發(fā)布自定義字符串處理程序,不能進(jìn)行輸出緩存處理的方法
解決Sharepoint無法連接發(fā)布自定義字符串處理程序,不能進(jìn)行輸出緩存處理的方法2010-03-03