使用 Django 构建动态网页

文章目录

    • [创建 Django 项目和应用程序](#创建 Django 项目和应用程序)
    • [创建 HTML 模板](#创建 HTML 模板)
    • 创建视图函数
    • [配置 URL 路由](#配置 URL 路由)
    • [运行 Django 服务器](#运行 Django 服务器)
    • [使用 Django 模板语言](#使用 Django 模板语言)

Django 是一个流行的 Python Web 框架,它能够帮助开发人员快速构建强大的 Web 应用程序。在 Django 中,HTML 是用于呈现网页内容的主要语言之一。本文将介绍如何在 Django 中使用 HTML 创建动态网页,并演示一些常见的 HTML 元素和 Django 模板语言的用法。

创建 Django 项目和应用程序

首先,确保已经安装了 Django。如果没有安装,可以使用以下命令:

bash 复制代码
pip install django

接下来,创建一个新的 Django 项目:

bash 复制代码
django-admin startproject myproject

然后,创建一个新的应用程序:

bash 复制代码
cd myproject
django-admin startapp myapp

创建 HTML 模板

在 Django 中,可以将 HTML 模板存储在应用程序的 templates 目录中。创建一个名为 index.html 的 HTML 文件,并将其放置在 myapp/templates 目录下:

html 复制代码
<!-- myapp/templates/index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>My Django App</title>
</head>
<body>
    <h1>Hello, Django!</h1>
    <p>Welcome to my Django app.</p>
</body>
</html>

创建视图函数

在 Django 中,视图函数用于处理 HTTP 请求并生成 HTTP 响应。打开 myapp/views.py 文件,并创建一个名为 index 的视图函数:

python 复制代码
# myapp/views.py
from django.shortcuts import render

def index(request):
    return render(request, 'index.html')

配置 URL 路由

要使视图函数能够响应特定的 URL 请求,需要配置 URL 路由。打开 myproject/urls.py 文件,并添加一个 URL 路由到 index 视图:

python 复制代码
# myproject/urls.py
from django.contrib import admin
from django.urls import path
from myapp import views

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', views.index, name='index'),
]

运行 Django 服务器

现在,可以运行 Django 服务器,并在浏览器中访问应用程序:

bash 复制代码
python manage.py runserver

打开浏览器,并访问 http://127.0.0.1:8000/,将会看到显示 "Hello, Django!" 的网页。

使用 Django 模板语言

除了简单地在 HTML 中编写静态内容外,Django 还提供了模板语言,可以在 HTML 中动态地插入变量、循环和条件语句。以下是一个示例:

html 复制代码
<!-- myapp/templates/greet.html -->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Greet User</title>
</head>
<body>
    <h1>Hello, {{ username }}!</h1>
    {% if age %}
    <p>You are {{ age }} years old.</p>
    {% else %}
    <p>Your age is unknown.</p>
    {% endif %}
</body>
</html>

在视图函数中传递变量给模板:

python 复制代码
# myapp/views.py
from django.shortcuts import render

def greet(request):
    context = {
        'username': 'John',
        'age': 30,
    }
    return render(request, 'greet.html', context)

然后,将视图函数和 URL 路由关联起来:

python 复制代码
# myproject/urls.py
from django.contrib import admin
from django.urls import path
from myapp import views

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', views.index, name='index'),
    path('greet/', views.greet, name='greet'),
]

现在,访问 http://127.0.0.1:8000/greet/,将会看到根据传递的变量动态生成的网页内容。

通过以上步骤,你已经学会了如何在 Django 中使用 HTML 创建动态网页,并利用 Django 模板语言使网页内容更加丰富和灵活。 Happy coding!

相关推荐
m0_7482540935 分钟前
2025最新华为云国际版注册图文流程-不用绑定海外信用卡注册
服务器·数据库·华为云
大新屋36 分钟前
MongoDB 分片集群修改管理员密码
数据库·mongodb
ejinxian1 小时前
MySQL/Kafka数据集成同步,增量同步及全量同步
数据库·mysql·kafka
未来之窗软件服务1 小时前
数据库优化提速(一)之进销存库存管理—仙盟创梦IDE
数据库·sql·数据库调优
Mapmost2 小时前
信创浪潮下的GIS技术变革:从自主可控到生态繁荣
数据库
foundbug9992 小时前
Node.js导入MongoDB具体操作
数据库·mongodb·node.js
天天进步20152 小时前
Node.js中的Prisma应用:现代数据库开发的最佳实践
数据库·node.js·数据库开发
hui函数3 小时前
Flask高效数据库操作指南
数据库·python·flask
大新屋4 小时前
MongoDB 分片集群复制数据库副本
数据库·mongodb