Praktische Tipps für XML-Volumen (3): dynamisches Paging

黄舟
Freigeben: 2017-02-10 16:16:29
Original
1704 Leute haben es durchsucht

Motivation:
Um Benutzern die Anzeige großer Datenmengen zu erleichtern, verwenden wir dynamisches Paging. Daher ist die Paging-Funktion das häufigste und am häufigsten verwendete Funktionsmodul, das wir auf der Website gesehen haben. In der Vergangenheit war das Informations-Paging mit der Datenbank verbunden und jeder Klick erforderte die Unterstützung der Hintergrunddatenbank. Dies erhöht nicht nur die Belastung des Servers, sondern beeinträchtigt auch die Browsing-Geschwindigkeit des Benutzers erheblich. Stellen Sie sich vor, welche Auswirkungen würde es haben, wenn die Paging-Funktion auf dem Client platziert würde? Haha, schauen Sie sich das Design unten an! .

Materialien:

XML-Volume-Dynamik-Paging
hat 2 Dateien: seiten.xml und seiten.xsl

Funktion:

Legen Sie die Paging-Funktion auf den Client. Filtern Sie Daten, ohne die Seite zu aktualisieren, und verbessern Sie so effektiv die Effizienz beim Durchsuchen von Daten.
Effekt:
Hier durchsuchen
Code:
pages.xml

<?xml version="1.0" encoding="gb2312" ?>
<?xml-stylesheet type="text/xsl" href="pages.xsl" ?>
<BlueIdea>
  <team>
    <blue_ID>1</blue_ID>
    <blue_name>Sailflying</blue_name>
    <blue_text>一个简单的分页</blue_text>
    <blue_time>2002-1-11 17:35:33</blue_time>
    <blue_class>XML专题</blue_class>
  </team>
  <team>
    <blue_ID>2</blue_ID>
    <blue_name>flyingbird</blue_name>
    <blue_text>嫁给你,是要你疼的</blue_text>
    <blue_time>2001-09-06 12:45:51</blue_time>
    <blue_class>灌水精华</blue_class>
  </team>
  <team>
    <blue_ID>3</blue_ID>
    <blue_name>苛子</blue_name>
    <blue_text>正则表达式在UBB论坛中的应用</blue_text>
    <blue_time>2001-11-23 21:02:16</blue_time>
    <blue_class>Web 编程精华</blue_class>
  </team>
  <team>
    <blue_ID>4</blue_ID>
    <blue_name>太乙郎</blue_name>
    <blue_text>年末经典分舵聚会完全手册 v0.1</blue_text>
    <blue_time>2000-12-08 10:22:48</blue_time>
    <blue_class>论坛灌水区</blue_class>
  </team>
  <team>
    <blue_ID>5</blue_ID>
    <blue_name>mmkk</blue_name>
    <blue_text>Asp错误信息总汇</blue_text>
    <blue_time>2001-10-13 16:39:05</blue_time>
    <blue_class>javascript脚本</blue_class>
  </team>
</BlueIdea>
Nach dem Login kopieren



pages.xsl


<?xml version="1.0" encoding="gb2312" ?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/TR/WD-xsl">
<xsl:template match="/">
<html>
<head>
<title> XML卷之实战锦囊(3):动态分页</title>
<style>
body,BlueIdea,team,blue_ID,blue_name,blue_text,blue_time,blue_class{ font: 12px "宋体", "Arial", "Times New Roman"; } 
table { font-size: 12px; border: 0px double; border-color: #99CC99 #99CC99 #CCCCCC #CCCCCC; cellpadding:3;cellspacing:3; bgcolor:#eeeeee; text-decoration: blink} 
span { font-size: 12px; color: red; }
.keybutton { cursor:hand; font-size: 12px; color: #003300; background: #ffffff; border: 0px solid;}
</style>
<script> 
<xsl:comment> 
<![CDATA[ 
var OnePageNum=2; 
var PageNum=1; 
var XMLPageNum=1; 
function pages(Num) 
{ 
stylesheet=document.XSLDocument; 
source=document.XMLDocument; 
nodes=source.documentElement.childNodes; 
len=nodes.length; 
for(i=1;i<=(len/OnePageNum);i++); 
XMLPageNum=i; 
var firstNum=0; 
var lastNume=0;
if (Num=="first") {PageNum=1;} 
if (Num=="previous") {if (PageNum>1) PageNum -=1;} 
if (Num=="next") {if (PageNum<XMLPageNum) PageNum +=1;} 
if (Num=="last") {PageNum =XMLPageNum;}
sortField=document.XSLDocument.selectSingleNode("//@expr"); 
firstNum=OnePageNum*(PageNum-1)+1; 
lastNum=OnePageNum*(PageNum-1)+OnePageNum; 
text="childnumber(this)>="+firstNum+" & childnumber(this)<="+lastNum; 
sortField.value=text; 
Layer1.innerHTML=source.documentElement.transformNode(stylesheet); 
} 
]]> 
</xsl:comment> 
</script>
</head>
<body>
<p align="center"><span>XML卷之实战锦囊(3):动态分页</span></p> 
<table align="center" width="500" > 
<tr> 
<td> 
<button id="cmdfirstPage" class="keybutton" onclick="pages(&#39;first&#39;);" >首页</button> 
<button id="cmdpreviousPage" class="keybutton" onclick="pages(&#39;previous&#39;);" >上一页</button>
<button id="cmdnextPage" class="keybutton" onclick="pages(&#39;next&#39;);">下一页</button> 
<button id="cmdlastPage" class="keybutton" onclick="pages(&#39;last&#39;);">尾页</button> 
</td> 
</tr> 
</table> 
<div id="Layer1" name="Layer1"> <xsl:apply-templates select="BlueIdea" /></div> 
</body>
</html>
</xsl:template>
<xsl:template match="BlueIdea">
<table width="500" border="1" align="center" cellpadding="1" cellspacing="1" bordercolordark="#ffffff" bordercolorlight="#ADAAAD">
<tr bgcolor="#FFCC99" align="center">
<td>编号</td>
<td>姓名</td>
<td>主题</td>
<td>发表时间</td>
<td>归类</td>
</tr>
<xsl:apply-templates select="team" order-by="blue_ID"/>
</table>
</xsl:template>
<xsl:template match="team">
<xsl:if expr="childnumber(this)>=1 & childnumber(this)<=2 ">
<tr align="center">
<xsl:apply-templates select="blue_ID" />
<xsl:apply-templates select="blue_name" />
<xsl:apply-templates select="blue_text" />
<xsl:apply-templates select="blue_time" />
<xsl:apply-templates select="blue_class" />
</tr>
</xsl:if> 
</xsl:template>
<xsl:template match="blue_ID">
<td bgcolor="#eeeeee">
<xsl:value-of />
</td>
</xsl:template>
<xsl:template match="blue_name">
<td>
<xsl:value-of />
</td>
</xsl:template>
<xsl:template match="blue_text">
<td>
<xsl:value-of />
</td>
</xsl:template>
<xsl:template match="blue_time">
<td>
<xsl:value-of />
</td>
</xsl:template>
<xsl:template match="blue_class">
<td>
<xsl:value-of />
</td>
</xsl:template>
</xsl:stylesheet>
Nach dem Login kopieren

Erklärung:
1) search.xml ist eine Datendatei, ich glaube, dass jeder kein Problem haben wird.
2) search.xsl ist eine Formatdatei, es gibt mehrere Dinge zu beachten.

(1) Im Skript:

nodes=source.documentElement.childNodes;
Nach dem Login kopieren
wird verwendet, um alle Knoten zu finden. nodes.length ist die Gesamtzahl der Knoten, die die Bedingungen


sortField=document.XSLDocument.selectSingleNode("//@expr");
Nach dem Login kopieren
erfüllen. Seine Funktion besteht darin, den ersten Knoten mit dem Attribut expr zu finden, sodass sein entsprechender Knoten


ist

<xsl:if expr="childnumber(this)>=1 & childnumber(this)<=2 ">
Nach dem Login kopieren
Nach dem Login kopieren
Der Wert von expr während des ersten onLoad beträgt also


childnumber(this)<=1 & childnumber(this)>=2
Nach dem Login kopieren
About> Was ist &? Es ist „UND“.

Einige andere finden Sie in XML-Büchern.

Parameterbeschreibung:

OnePageNum: die Anzahl der auf jeder Seite angezeigten Daten
PageNum: die aktuelle Seitennummer
XMLPageNum: die Gesamtzahl der Seiten
firstNum: Der erste Datenwert der aktuellen Seite
lastNum: Der letzte Datenwert der aktuellen Seite

(2) Im Text:

<xsl:if expr="childnumber(this)>=1 & childnumber(this)<=2 ">
Nach dem Login kopieren
Nach dem Login kopieren
Beim Paging müssen wir geeignete Daten ausgeben, daher verwenden wir zur Steuerung eine if-Beurteilungsbedingung.

In der Anfangsphase verlangen wir, dass nur die Werte der ersten beiden Knoten ausgegeben werden.

childnumber(this)

Funktion: Gibt die Nummer des aktuellen Knotens in seiner übergeordneten Knotenliste zurück. Die Standardnummer des ersten Knotens in der Liste ist 1.
Beim Paging beurteilen wir anhand der Nummer des Knotens, zu welcher Seite es gehört.
expr
Ich weiß nicht, ob Ihnen aufgefallen ist, dass wir die ersten beiden Male test verwendet haben, aber dieses Mal haben wir expr verwendet.
Es gibt bestimmte Unterschiede zwischen ihnen und auch ihre Verwendung ist unterschiedlich.
expr ── Skriptsprachausdruck, das Berechnungsergebnis ist „wahr“ oder „falsch“; wenn das Ergebnis „wahr“ ist und den Test besteht, wird der Inhalt in der Ausgabe angezeigt (dieses Attribut kann weggelassen werden).
Test ── Quelldaten-Testbedingungen.

<button id="cmdfirstPage" class="keybutton" onclick="pages(&#39;first&#39;);" >首页</button>
Nach dem Login kopieren
wird verwendet, um die Daten zur vorherigen Seite zurückzukehren. Die anderen Tasten funktionieren ähnlich.


Zusätzlicher Punkt: So verwenden Sie XML-Beispieldateien

1) Speichern Sie die beiden Dateien in jedem Beispiel getrennt nach ihren Dateinamen.

2) Durchsuchen Sie einfach die XML-Datei mit einem Browser. Das ist der Effekt, den Sie sehen werden, er sollte gut sein!

Postscript:
Haha, Sie können die Funktion der dynamischen Sortierung und anschließenden Paginierung hinzufügen. Machen Sie dann die Anzahl der Listen konfigurierbar. Lassen Sie Ihrer Fantasie freien Lauf, um diese Funktionen zu perfektionieren. Sie können nach besseren Möglichkeiten zur Implementierung der Paging-Funktionalität suchen. Es ist toll, miteinander zu diskutieren!

Das Obige sind die praktischen Tipps für XML-Volumes (3): Der Inhalt des dynamischen Pagings. Weitere verwandte Inhalte finden Sie auf der chinesischen PHP-Website (www.php.cn)!

Verwandte Etiketten:
xml
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage