Rumah  >  Artikel  >  hujung hadapan web  >  Cara menggunakan Node.js untuk melompat ke halaman html

Cara menggunakan Node.js untuk melompat ke halaman html

青灯夜游
青灯夜游ke hadapan
2022-01-06 18:50:375247semak imbas

Bagaimana untuk menggunakan Node.js untuk melompat ke halaman? Artikel ini akan memperkenalkan kepada anda cara melaksanakan lompat halaman html berdasarkan Node Saya harap ia akan membantu anda!

Cara menggunakan Node.js untuk melompat ke halaman html

Penerangan Masalah

Baru-baru ini, saya menggunakan Node.js dan html untuk mempelajari pengetahuan berkaitan halaman tersebut belajar lompat halaman, , terdapat masalah lompat yang tidak berjaya, direkodkan di sini untuk rujukan masa hadapan.

Dalam Node.js, rangka kerja ekspres digunakan terutamanya dan html digunakan pada bahagian hadapan.

Struktur kod projek

Demo kecil ini terutamanya melibatkan empat fail, termasuk:

  • main.js: Bahagian ini ialah fail permulaan, iaitu Fail kemasukan untuk keseluruhan projek;

  • main.html: Bahagian ini ialah fail html halaman utama; Untuk melompat Fail html halaman; 🎜>

  • node_modules: Folder untuk menyimpan modul berkaitan.
  • Nota: main.html dan new.html berada dalam folder paparan.
  • Konfigurasi modul berkaitan

  • Gunakan npm untuk memasang tiga modul berikut masing-masing:
  • ekspresi

    templat seni
express -art-template

Bina bahagian utama.js

seperti berikut:
  • melaksanakan pemantauan port 3000.
  • Bina router.js
  • Dalam fail ini, ia terutamanya mencipta tika penghalaan, memantau URL dan parameter yang berkaitan dan memaparkan antara muka yang berkaitan. Bahagian

adalah seperti berikut:

代码

Build main.html
const express = require('express')
const app = express()
const router = require('./router')

app.engine('html',require('express-art-template'))
app.use(router)

app.listen(3000,() => {
  console.log('successful...')
})

Di bawah fail ini, hanya satu hiperpautan dilaksanakan untuk melompat ke halaman , bahagian

adalah seperti berikut:

Bina new.html

Fail ini sangat mudah, hanya gunakan baris pernyataan output untuk menunjukkan lompatan yang berjaya, 代码 bahagian adalah seperti berikut:

const express = require('express') //创建路由实例
const router = express.Router()

router.get('/',(req,res) => {

  res.render('main.html')
})

module.exports = router  //暴露接口

Hasil jalankan

Masukkan 代码 dalam skrin hitam kecil:

<div>
 <a href="/new" >页面跳转</a> <!--跳转至新页-->
</div>

Kod berjalan dengan jayanya, buka

:

代码

<div>
 <th>成功实现跳转</th>
</div>
Anda boleh melihat hiperpautan untuk melompat ke halaman Klik hiperpautan ini:

Halaman tidak mencapai lompatan yang berkesan. 命令

Analisis dan penyelesaian masalah
node main.js

Jika anda menggunakan bahasa HTML semata-mata, anda boleh terus ke hiperpautan Selepas menggunakan penghala, anda harus memantau URL yang berkaitan sebelum anda boleh melompat. http://localhost:3000

Jadi, tambahkan

berikut dalam router.js: Cara menggunakan Node.js untuk melompat ke halaman html

Iaitu, apabila URLnya Cara menggunakan Node.js untuk melompat ke halaman html, gunakan res.render untuk melompat.

Memandangkan hiperpautan html konsisten dengan pautan yang diberikan oleh pemaparan, lompatan menggunakan hiperpautan boleh dicapai.

Kesan lompatan adalah seperti berikut:

代码 Masalah ini selesai!

router.get(&#39;/new&#39;,function(req,res){
  res.render(&#39;new.html&#39;)
})
Untuk lebih banyak pengetahuan berkaitan nod, sila lawati:

tutorial nodejslocalhost:3000/new! !

Atas ialah kandungan terperinci Cara menggunakan Node.js untuk melompat ke halaman html. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Artikel ini dikembalikan pada:csdn.net. Jika ada pelanggaran, sila hubungi admin@php.cn Padam