Node.js を使用して HTML ページにジャンプする方法

Node.js を使用してページにジャンプするにはどうすればよいですか?この記事では、Node に基づいて HTML ページジャンプを実装する方法を紹介します。

問題の説明

最近、私は Node.js と html を使用して、ページの関連知識を学習しています。ページ ジャンプについて学習します。ジャンプが失敗するという問題がありました。将来の参考のためにここに記録されています。

Node.js では主に Express フレームワークが使用され、フロントエンドでは html が使用されます。

プロジェクト コード構造

この小さなデモには、主に次の 4 つのファイルが含まれます。

• ##main.js: この部分は開始ファイルです。プロジェクト全体のエントリ ファイル;

• main.html: この部分はメイン ページの HTML ファイルです;

• new.html:ジャンプするには ページの HTML ファイル;

• router.js: URL とパラメータに基づいて特定の操作を行うために使用されるルーティング ファイル;

• node_modules: 関連モジュールを保存するフォルダー。

注: main.html と new.html はビュー フォルダーにあります。

関連モジュール構成

npm を使用して、次の 3 つのモジュールをそれぞれインストールします:

express
• art-template
• Express -art-template

main.jsのビルド

コード 部分は次のとおりです。

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...')
})

ポート 3000 の監視を実装しました。

router.js のビルド

このファイルでは、主にルーティング インスタンスを作成し、URL と関連パラメーターを監視し、関連インターフェイスをレンダリングします。

コード部分は次のとおりです:

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

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

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

module.exports = router  //暴露接口

Build main.html

このファイルの下には、ページジャンプを実装するためのハイパーリンクが 1 つだけ実装されています。

code 部分は次のとおりです:

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

Build new.html

このファイルは非常に単純で、出力ステートメントの行を使用してジャンプが成功したことを示すだけです。

コードの 部分は次のとおりです:

<div>
 <th>成功实现跳转</th>
</div>

実行結果

小さな黒い画面に

コマンドを入力します:

node main.js

コードは正常に実行され、

http://localhost:3000:

ページにジャンプするためのハイパーリンクが表示されます。このハイパーリンクをクリックしてください:

ページ 効果的なジャンプは達成されません。

問題の分析と解決策

純粋に HTML 言語を使用する場合、ハイパーリンクに直接ジャンプできますが、ルーターを使用した後、ジャンプを実現するために関連する URL の監視を実装する必要があります。ゴール。

したがって、次の

code を router.js に追加します。

router.get('/new',function(req,res){
  res.render('new.html')
})

つまり、URL が

localhost:3000/new の場合、次のようにします。解像度のレンダリングジャンプ。

HTML のハイパーリンクは render でレンダリングされたリンクと一致しているため、ハイパーリンクを使用したジャンプが実現できます。

ジャンプ効果は次のとおりです:

これで問題は解決されました。

ノード関連の知識の詳細については、

nodejs チュートリアル を参照してください。 ！

以上がNode.js を使用して HTML ページにジャンプする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。