加載靜態文件,父模板的繼承和擴展

阿新 • • 發佈：2017-11-03

ges perf bmi cli wid spa pre __main__ oal

用url_for加載靜態文件
1. <script src="{{ url_for(‘static‘,filename=‘js/login.js‘) }}"></script>
2. flask 從static文件夾開始尋找
3. 可用於加載css, js, image文件
繼承和擴展
1. 把一些公共的代碼放在父模板中，避免每個模板寫同樣的內容。base.html
2. 子模板繼承父模板
  1. {% extends ‘base.html’ %}
3. 父模板提前定義好子模板可以實現一些自己需求的位置及名稱。block
  1. <title>{% block title %}{% endblock %}-MIS問答平臺</title>
  2. {% block head %}{% endblock %}
  3. {% block main %}{% endblock %}
4. 子模板中寫代碼實現自己的需求。block
  1. {% block title %}登錄{% endblock %}
首頁、登錄頁、註冊頁都按上述步驟改寫。

untitled

from flask import Flask,render_template

app = Flask(__name__)


@app.route(‘/‘)
def base():
    return render_template(‘base.html‘)

@app.route(‘/load/ 
‘)
def load():
    return render_template(‘load.html‘)

@app.route(‘/register/‘)
def register():
    return render_template(‘register.html‘)

if __name__ == ‘__main__‘:
    app.run()

base.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>
        { 
% block title %}{% endblock %}
        首頁
    </title>

    <link rel="stylesheet" type="text/css" href="{{ url_for(‘static‘,filename=‘css/base.css‘) }}">
    <script src="{{ url_for(‘static‘,filename=‘js/base.js‘) }}"></script>
{% block head %}
{% endblock %}

</head>

<body id="myBody">

    <nav>
    <img src="http://p1.img.cctvpic.com/photoAlbum/page/performance/img/2013/8/27/1377583188891_732.jpg" width="800px"height="150px"><br>

        <img id="myOnOff" onclick="mySwitch()" src="http://www.runoob.com/images/pic_bulbon.gif" width="25px">

    <a href="http://www.sesamestreetchina.com.cn/">首頁</a>
    <input type="text"name="search">
    <button type="submit">搜索</button>
    <a href="{{ url_for(‘login‘) }}">登錄</a>
    <a href="{{ url_for(‘regist‘) }}">註冊</a>
<img src="{{ url_for(‘static‘,filename=‘image/86x97sZ11K4.jpg‘) }}" alt="" width="50px">


</nav>

<div class="area">
{% block main %}
{% endblock %}

</div>

<footer>
    <div class="footer_box">
        Copyright@2017 個人版權，版權所有　　作者：楊碧茜</div>
    </footer>


</body>
</html>

技術分享

加載靜態文件,父模板的繼承和擴展

ges perf bmi cli wid spa pre __main__ oal 用url_for加載靜態文件 <script src="{{ url_for(‘static‘,filename=‘js/login.js‘) }}"></script

Django 模板加載靜態文件

設置 sta all temp emp 手動 pps 路徑標簽加載靜態文件的步驟如下： 1、首先確保 django.contrib.staticfiles 已經添加到settings.INSTALLED_APPS中。 2、確保在 settings.py中設置了STATI

eclipse中啟動spring-mvc項目時無法加載靜態文件的問題分析

spring-mvc 靜態文件加載問題表現：eclipse裏使用spring-mvc框架開發web項目，項目正常啟動後能訪問jsp頁面，但jsp頁面的網頁效果沒有生效，並提示jsp文件裏提示js找不到，404錯誤。（1）初步判斷：在瀏覽器裏debug時，jsp頁面提示js文件找不到，提示404錯誤。

nginx提高加載靜態文件速度

script ima min con pla gzip 使用 pan level 1.本來對於靜態網頁，我們不需要放在應用容器中，原因一時由於應用服務器是用來解析動態網頁的，針對靜態網頁本來就性能不高，而且還會占用應用容器的資源，所以我們專門使用nginx用來解析靜態網頁。

openGL加載obj文件+繪制大腦表層+高亮染色

ear ces matrix swa clas cout initial 改變 model b 繪制大腦表層並高亮染色的工作是以openGL加載obj文件為基礎的，這裏是我們用到的原始程序：只能加載一個obj文件的demo。然而，一個完整的大腦表層是由很多分區組成的，因此

java加載properties文件的六中基本方式實現

alt user 通過 put main import port pac 技術 java加載properties文件的方式主要分為兩大類：一種是通過import java.util.Properties類中的load(InputStream in)方法加載；另一種是通過

angularjs ocLazyLoad分步加載js文件,angularjs ocLazyLoad按需加載js

path 技術分享 active meta 代碼效果 function 初始化 reat 用angular有一段時間了,平日裏只顧著寫代碼,沒有註意到性能優化的問題,而今有時間,於是捋了捋,講學習過程記錄於此: 問題描述:由於采用angular做了網頁的單頁面應用,

jquery加載單文件vue組件

gif -h json enter bsp register replace align console /**註冊組件 */ function registerComponent(name){ dm[name] = {}; Vue

代碼收藏系列--php--加載sql文件並解析成數組

存儲過程 exist eat ati body his ble class 註釋 php加載sql文件，解析成以分號分割的數組。(支持存儲過程和函數提取，自動過濾註釋) /** * 加載sql文件為分號分割的數組 * <br />支持存儲過程和函數提取

JVM加載.class文件的原理機制

str 空間引用數據系統 bootstra 開發人員文件的產生當java編譯器將.java文件編譯成.class文件後，需要JVM執行.class文件，將class文件加載到內存中，從而對數據進行校驗、解析和初始化。 1、類加載的一般過程（1）尋找jre目錄，

spring boot 加載配置文件

path 方式屬性 pro rri config 有時命令行配置在springboot啟動的過程中，默契情況下會在classpath路徑下加載application.properties當做系統配置文件，但有時候我們想要替換成另一個文件，可以通過以下方式：一

SpringMVC加載.roperties文件屬性值的方法？

ssp del property string 說了文件屬性 val request con 1.在xml文件中引入來獲取屬性值就不說了。 2.在controller層獲取引用配置文件中的屬性值： (1).編寫工具類 @Configuration @PropertyS

springboot 不加載yaml文件的問題

搜索發現 img 文檔官方 log key spring 文件初學Spring Boot，遇到配置文件位置對了，就是不加載。看官方文檔，說要加入SnakeYaml依賴。於是搜索，加入。發現還是不行。又繼續加。行了，原來我加錯了。上面那個是spring b

避免緩存，Java動態加載配置文件

避免 utf can tle == 文件的 coder txt col Java動態加載配置文件關鍵：每次讀取都要重新生成流今天無意間在項目的代碼中看到如下這樣一段簡單加載配置文件的代碼： Properties prop = new Properties();InputSt

Spring筆記02（3種加載配置文件的方式）

con 創建對象 face ati prototype property str als cati 1.不使用Spring的實例： 01.Animal接口對應的代碼： package cn.pb.dao; /** * 動物接口 */ public interface

mybatis加載配置文件詳解

creat insert mapper mman sql 源碼 none includes lds spring整合Mybatis後，SqlSessionFactory的創建由spring進行了代理，以下是SqlSessionFactory創建的流程 SqlSessio

web 中加載配置文件

code set 監聽器 XML sign rri ace this keyword 1.web.xml中配置  <listener> <description>ServletCo

在HTML頁面中加載js文件和css文件的方法

logs ext mar 頁面 document 文件 class link child 1.在HTML頁面加載js文件的方法： function loadScriptFile(filePath){ var script = document.createEle

spring加載配置文件

ets pooled set方法 enc @property 引用 autowired 加載 org 在項目中有些參數經常需要修改，或者後期可能會有改動時，那我們最好把這些參數放到properties文件中，在源代碼中讀取properties裏面的配置，這樣後期只需要改動p

JVM加載class文件的順序

system 技術分享執行直接初始變量構造器 class sta http://blog.csdn.net/jackfrued/article/details/44921941第21題類的加載是指把類的.class文件中的數據讀入到內存中，通常是創建一個字節數組

加載靜態文件,父模板的繼承和擴展

相關推薦