motivación:
Para facilitar que los usuarios vean grandes cantidades de datos, utilizaremos paginación dinámica, por lo que la función de paginación es el módulo funcional más común y utilizado que hemos visto en el sitio web. En el pasado, la paginación de información estaba conectada a la base de datos y cada clic requería el soporte de la base de datos en segundo plano. Esto no sólo aumenta la carga sobre el servidor, sino que también afecta seriamente la velocidad de navegación del usuario.
Imagínese, si la función de paginación se aplica al cliente, ¿qué tipo de efecto tendrá? Jaja, ¡mira el diseño a continuación! .
Material:
La paginación dinámica del volumen XML tiene dos archivos: páginas.xml y páginas.xsl.
Las funciones son:
Coloque la función de paginación en el lado del cliente. Filtre datos sin actualizar la página, mejorando efectivamente la eficiencia de los datos de navegación.
Efecto:
Navegar aquí
Código:
paginas.xml
páginas.xsl
cuerpo,BlueIdea,equipo,blue_ID,blue_name,blue_text,blue_time,blue_class{ fuente: 12px "宋体", "Arial", "Times New Roman" }
tabla {tamaño de fuente: 12px; borde: 0px doble; color de borde: #99CC99 #99CC99 #CCCCCC #CCCCCC; espacio entre celdas: 3; bgcolor:#eeeeee;
abarcar {tamaño de fuente: 12px; color: rojo}
.keybutton {cursor:mano; tamaño de fuente: 12px; color: #003300; fondo: #ffffff;
varOnePageNum=2;
varNúmPágina=1;
var XMLPageNum=1;
páginas de funciones (Núm)
{
hoja de estilo=documento.XSLDocumento;
fuente=documento.XMLDocumento;
nodos=source.documentElement.childNodes;
len=nodos.longitud;
for(i=1;i<=(len/OnePageNum);i++);
NúmPáginaXML=i;
var primerNum=0;
var últimoNum=0;
if (Num=="primero") {NumPágina=1;}
if (Num=="anterior") {if (PageNum>1) PageNum -=1;}
if (Num=="siguiente") {if (NumPágina
sortField=document.XSLDocument.selectSingleNode(" //@expr ");
primerNum=OnePageNum*(PageNum-1)+1;
lastNum=OnePageNum*(PageNum-1)+OnePageNum;
text="númeroniño(este)>="+primerNum+" & númeroniño(este)<="+últimoNum;
sortField.value=texto;
Layer1.innerHTML=source.documentElement.transformNode(hoja de estilo);
}
]]>
Consejos prácticos para el volumen XML (3): paginación dinámica
nodos=source.documentElement.childNodes; sortField=document.XSLDocument.selectSingleNode(" //@expr "); Descripción del parámetro: número de niño (este) Un punto adicional: cómo utilizar archivos de ejemplo XML 1) Guarde los dos archivos de cada ejemplo por separado según sus nombres de archivo.
Número
Nombre
Tema
Hora de publicación
Clasificación
explicar:
1) search.xml es un archivo de datos, creo que no habrá ningún problema para todos.
2) search.xsl es un archivo de formato, hay varias cosas a las que prestar atención.
(1) En el script:
La función es: encontrar todos los nodos. nodes.length es el número total de nodos que cumplen las condiciones
La función es: encontrar el primer nodo con el atributo expr, por lo que su nodo correspondiente es
Por lo tanto, el valor de expr durante el primer onLoad es
númeroniño(este)<=1 & númeroniño(este)>=2
Acerca de > Es posible que esté más familiarizado con él. Entonces, ¿qué es & Es "y".
Puede encontrar otros en libros XML.
OnePageNum: la cantidad de datos que se muestran en cada página
PageNum: número de página actual
XMLPageNum: número total de páginas
firstNum: el primer valor de datos de la página actual
lastNum: el último valor de datos de la página actual
(2) En el texto:
En la paginación, necesitamos generar datos apropiados, por lo que usamos una condición de juicio if para controlarlos.
Al principio, solicitamos que solo se generaran los valores de los dos primeros nodos.
Función: Devuelve el número del nodo actual en su lista de nodos superiores. El número predeterminado del primer nodo de la lista es 1.
En la paginación, juzgamos a qué página pertenece según el número del nodo.
exprés
No sé si habrás notado que las dos primeras veces usamos test, pero esta vez usamos expr.
Existen ciertas diferencias entre ellos y su uso también es diferente.
expr: expresión del lenguaje de secuencias de comandos. El resultado del cálculo es "verdadero" o "falso". Si el resultado es "verdadero" y pasa la prueba, el contenido se mostrará en la salida (este atributo se puede omitir).
prueba ── condiciones de prueba de datos fuente.
La función es devolver los datos a la página anterior. Los otros botones funcionan de manera similar.
2) Utilice un navegador para explorar el archivo XML. Este es el efecto que verás, ¡debería ser bueno!
posdata:
Jaja, puedes agregar la función de paginación después de la clasificación dinámica. Luego haga que el número de listas sea configurable. Usa tu imaginación para hacer estas funciones más perfectas. Puede investigar mejores formas de implementar la funcionalidad de paginación. ¡Es genial discutir entre nosotros!