溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》

XML和XSLT如何結(jié)合使網(wǎng)站設(shè)計渾然一體

發(fā)布時間:2021-09-17 14:41:54 來源:億速云 閱讀:149 作者:小新 欄目:編程語言

這篇文章主要介紹了XML和XSLT如何結(jié)合使網(wǎng)站設(shè)計渾然一體,具有一定借鑒價值,感興趣的朋友可以參考下,希望大家閱讀完這篇文章之后大有收獲,下面讓小編帶著大家一起了解一下。

xml和XSLT的轉(zhuǎn)換使Web設(shè)計受益無窮。借助XML和 XSLT轉(zhuǎn)換,你可以實現(xiàn)將動態(tài)用語(dynamic verbiage)和網(wǎng)站內(nèi)容存儲在數(shù)據(jù)庫中。你可以在XML中傳輸數(shù)據(jù)庫,然后再通過XSLT轉(zhuǎn)換將其轉(zhuǎn)變?yōu)镠TML腳本。

  在網(wǎng)絡(luò)發(fā)展初期,凝聚性(cohesiveness)是由服務(wù)器端實現(xiàn)的,但要牽涉到大量的人工文件管理工作。幸運的是,隨著網(wǎng)絡(luò)的日益成熟,網(wǎng)絡(luò)開發(fā)工具也日臻完善。例如,在.NET框架下,你可以創(chuàng)建各種Web控件來統(tǒng)一設(shè)計。

  在設(shè)計用戶/數(shù)據(jù)交互功能時,如何讓數(shù)據(jù)的完整性、用戶界面的功能性和商務(wù)規(guī)則的完善實現(xiàn)。本文將提供一個網(wǎng)站實例,并說明XML 和XSLT如何使你的網(wǎng)站設(shè)計渾然一體。

以下是引用片段:

<html> 
<head> 
</head> 
<body> 
<form method="POST" name="thisForm" id="thisForm" action="somepage.php"> 
<input type="text" name="txtText" id="txtText" size="25"><br> 
<input type="submit" name="btnSubmit" id="btnSubmit" value="Submit"> 
</form> 
</body> 
</html>  

以上代碼段完成了主要功能,但還需用XML和XSLT來對其加以美化。

  在XML中,代碼有開頭和結(jié)尾標(biāo)簽,而在HTML中沒有。INPUT 和BR標(biāo)簽是個特例,它們不需結(jié)尾標(biāo)簽。然而,在結(jié)尾標(biāo)簽標(biāo)記“>”前加一個正斜杠,可確保HTML符合XML規(guī)范。如果在編寫HTML腳本時注意遵從這些規(guī)范,你就能夠?qū)ML/HTML(aka XHTML)轉(zhuǎn)換為不錯的HTML頁面?! ?/p>

以下是引用片段:

<form method="POST" name="thisForm" id="thisForm" action="somepage.php"> 
<input type="text" name="txtText" id="txtText" size="25" transform="blueText"/> 
<br/> 
<input type="submit" name="btnSubmit" id="btnSubmit" value="Submit" 
transform="bigButton"/> 
</form> 運行下列代碼,完成XSLT轉(zhuǎn)換: 
<?xml version="1.0"?> 
<xsl:stylesheet 
xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0" 
> 
<xsl:output method="html"/> 
<xsl:template match="/"> 
<table width="100%" cellpadding="0" cellspacing="0"> 
<tr><td align="center">This is the defined header</td></tr> 
<tr><td><xsl:apply-templates select="//form"/></td></tr> 
<tr><td align="center">This is the defined footer</td></tr> 
</table> 
</xsl:template> 
<xsl:template match="form"> 
<xsl:element name="form"> 
<xsl:attribute name="method"><xsl:value-of 
select="@method"/></xsl:attribute> 
<xsl:attribute name="action"><xsl:value-of 
select="@action"/></xsl:attribute> 
<xsl:attribute name="name"><xsl:value-of select="@name"/></xsl:attribute> 
<xsl:attribute name="id"><xsl:value-of select="@id"/></xsl:attribute> 
<xsl:apply-templates select="*"/> 
</xsl:element> 
</xsl:template><xsl:template match="*"> 
<xsl:choose> 
<xsl:when test="@transform='blueText'"><xsl:element name="input"> 
<xsl:attribute name="name"><xsl:value-of select="@name"/></xsl:attribute> 
<xsl:attribute name="id"><xsl:value-of select="@id"/></xsl:attribute> 
<xsl:attribute name="type">text</xsl:attribute> 
<xsl:attribute name="style">color:blue</xsl:attribute> 
<xsl:if test="@value"><xsl:attribute name="value"><xsl:value-of 
select="@value"/></xsl:attribute></xsl:if> 
</xsl:element> 
</xsl:when> 
<xsl:when test="@transform='redText'"><xsl:element name="input"> 
<xsl:attribute name="name"><xsl:value-of 
select="@name"/></xsl:attribute> 
<xsl:attribute name="id"><xsl:value-of 
select="@id"/></xsl:attribute> 
<xsl:attribute name="type">text</xsl:attribute> 
<xsl:attribute name="style">color:red</xsl:attribute> 
<xsl:if test="@value"><xsl:attribute name="value"><xsl:value-of 
select="@value"/></xsl:attribute></xsl:if> 
</xsl:element> 
</xsl:when> 
<xsl:when test="@transform='bigButton'"><xsl:element name="input"> 
<xsl:attribute name="name"><xsl:value-of 
select="@name"/></xsl:attribute> 
<xsl:attribute name="id"><xsl:value-of 
select="@id"/></xsl:attribute> 
<xsl:attribute name="style">height:30px;width:100px;font- 
size:18pt;font-weight:700;</xsl:attribute> 
<xsl:attribute name="value"><xsl:value-of 
select="@value"/></xsl:attribute> 
</xsl:element> 
</xsl:when> 
</xsl:choose> 
</xsl:template> 
</xsl:stylesheet>

  以上代碼無法為你實現(xiàn)創(chuàng)建命名空間、定義XML標(biāo)簽、確認(rèn)DTD或schema。它使你能夠創(chuàng)建可行的HTML腳本,并可轉(zhuǎn)化為完整的新頁面,無需擔(dān)心設(shè)計因素。

  在樣式表中,用HTML標(biāo)簽的轉(zhuǎn)換屬性驅(qū)動轉(zhuǎn)換操作。我曾考慮用一個FORM窗體作為定義轉(zhuǎn)換操作所需的用戶控件的單元,因為所有用于用戶輸入的控件都應(yīng)在一個FORM中。本例中,輸出為一個文本INPUT,文本顏色為藍(lán)色;一個高20像素、寬100像素的按鈕,字體為18點加粗。我們可以通過修改轉(zhuǎn)換屬性來改變文本框中的文本顏色。

  有多種方法可將靜態(tài)內(nèi)容添加到網(wǎng)頁中本例中只采用最簡單的方式,即在樣式表中增加header和footer。

  現(xiàn)在,要創(chuàng)建一個新窗體用于用戶輸入時,要做的只是創(chuàng)建一個一般窗體。一旦一般窗體通過測試,就可以將這些窗體添加到轉(zhuǎn)換中生成主題的HTML輸出。你只要記住輸入控件類型,并注意把它添加為轉(zhuǎn)換屬性即可。

感謝你能夠認(rèn)真閱讀完這篇文章,希望小編分享的“XML和XSLT如何結(jié)合使網(wǎng)站設(shè)計渾然一體”這篇文章對大家有幫助,同時也希望大家多多支持億速云,關(guān)注億速云行業(yè)資訊頻道,更多相關(guān)知識等著你來學(xué)習(xí)!

向AI問一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報,并提供相關(guān)證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI