您当前的位置:首页 > 电脑百科 > 程序开发 > 语言 > HTML

html渲染和模板的使用

时间:2022-03-17 12:55:42  来源:  作者:萧潇墨

我们可以使用以下的方式去渲染html

func mAIn() {
	router := gin.Default()
	router.LoadHTMLGlob("templates/*")
	//router.LoadHTMLFiles("templates/template1.html", "templates/template2.html")
	router.GET("/index", func(c *gin.Context) {
		c.HTML(http.StatusOK, "index.tmpl", gin.H{
			"title": "Main website",
		})
	})
	router.Run(":8080")
}

在html中我们可以使用特殊的双花括号来渲染title这个值

<html>
	<h1>
		{{ .title }}
	</h1>
</html>

值得注意的是这种方式并不是gin特有的,而是golang特有的,它还有其他的模板语法。

 

模板语法:

定义变量:

{{$article := "hello"}}

也可以给变量赋值

{{$article := .ArticleContent}}

函数的调用:

{{funcname .arg1 .arg2}}

判断语法:

{{if .condition}}
{{end}}
{{if .condition1}}
{{else if .contition2}}
{{end}}
  • not 非
{{if not .condition}}
{{end}}
  • and 与
{{if and .condition1 .condition2}}
{{end}}
  • or 或
{{if or .condition1 .condition2}}
{{end}}
  • eq 等于
{{if eq .var1 .var2}}
{{end}}
  • ne 不等于
{{if ne .var1 .var2}}
{{end}}
  • lt 小于
(less than){{if lt .var1 .var2}}
{{end}}
  • le 小于等于
{{if le .var1 .var2}}
{{end}}
  • gt 大于
{{if gt .var1 .var2}}
{{end}}
  • ge 大于等于
{{if ge .var1 .var2}}
{{end}}

循环:

{{range $i, $v := .slice}}
{{end}}

引入一个模板:

{{template "navbar"}}


Tags:html   点击:()  评论:()
声明:本站部分内容及图片来自互联网,转载是出于传递更多信息之目的,内容观点仅代表作者本人,不构成投资建议。投资者据此操作,风险自担。如有任何标注错误或版权侵犯请与我们联系,我们将及时更正、删除。
▌相关推荐
如何使用 templ 在 Go 中编写 HTML 用户界面?
简介templ[1] 是一个在 Go 中编写 HTML 用户界面的语言。使用 templ,我们可以创建可呈现 HTML 片段的组件,并将它们组合起来创建屏幕、页面、文档或应用程序。安装我们可以通...【详细内容】
2023-12-21  Search: html  点击:(174)  评论:(0)  加入收藏
前端工作方式要换了?HTMX简介:无需JavaScript的动态HTML
HTMX允许你使用扩展的HTML语法代替 JavaScript 来实现交互性。HTMX 在标记中直接为你提供HTTP 交互,并支持许多其他交互需求,无需求助于 JavaScript。这是一个有趣的想法,可能...【详细内容】
2023-10-19  Search: html  点击:(293)  评论:(0)  加入收藏
解密前端三巨头:HTML、CSS和JavaScript的关系
如果你想成为一名Web开发者,或者只是想了解网页是如何构建的,那么你一定会遇到这三个词:HTML、CSS和JavaScript。它们是构建现代网页的三大核心技术,它们虽然看似不同,但在实际中...【详细内容】
2023-10-07  Search: html  点击:(237)  评论:(0)  加入收藏
HTMX简介:无需借助JavaScript的动态HTML
译者 | 布加迪审校 | 重楼HTML让您可以使用扩展的HTML语法而不是JavaScript来实现交互性。HTMX直接在标记中为您提供了HTTP交互,它支持其他许多交互要求,无需借助JavaScript。...【详细内容】
2023-10-07  Search: html  点击:(374)  评论:(0)  加入收藏
htmx:增强版 HTML 来了!
如今,Web 用户期望得到单页应用(SPA)提供的流畅、动态的体验。然而,创建 SPA 往往需要使用复杂的框架,如 React 和 Vue,学习和使用起来可能比较困难。这就是htmx的用武之地:一种通...【详细内容】
2023-09-03  Search: html  点击:(222)  评论:(0)  加入收藏
加入GitHub Accelerator,htmlx 2.0 要来了!
本文主要向大家介绍 htmlx 加入 GitHub Accelerator,关于 htmlx 的原理,以前有单独发表过文章介绍: 让 React 代码行数减少78%的 htmlx 有这么神?大家有感兴趣的可以阅读,话不多...【详细内容】
2023-08-25  Search: html  点击:(366)  评论:(0)  加入收藏
爬虫解析HTML动态JS,技术应用揭秘
在当今互联网时代,大量的信息都储存在了各种网页中。而对于开发者、数据分析师和研究人员来说,获取并分析这些网页中的数据是非常重要的任务之一。然而,随着技术的不断发展,许多...【详细内容】
2023-06-29  Search: html  点击:(220)  评论:(0)  加入收藏
利用ChatGPT辅助处理Html数据
使用chatgpt进行辅助编程首先要清晰描述自己需求,生成代码通过不断调试及优化,最终完成任务。有它,对程序员是好事也是坏事。一、确认功能请编程实现以下功能:1.所有html保存在a...【详细内容】
2023-05-31  Search: html  点击:(422)  评论:(0)  加入收藏
HTMLUnit无法抓取Vue页面,前端开发者困扰
最近,很多前端开发者在使用 HTMLUnit 进行页面爬取时,发现无法抓取到 Vue 生成的页面。这是一个普遍的问题,许多人都在寻找解决方案。本文将对这个问题进行详细分析,并提供解决...【详细内容】
2023-05-23  Search: html  点击:(296)  评论:(0)  加入收藏
一篇文章带你学会HTML以及最常用的标签
HTML是一种标记语言,用于创建网页。在本文中,我们将介绍HTML的基础知识,代码写入到本地文件,并以.html结尾,双击浏览器打开就可以查看效果。HTML文档结构HTML文档由标签组成,每个...【详细内容】
2023-05-16  Search: html  点击:(374)  评论:(0)  加入收藏
▌简易百科推荐
Htmx,它到底是框架还是库?
在最近的前端开发技术的探讨中,htmx经常成为热议的话题。一些人批评它,认为尽管htmx批评现代前端框架过于复杂,但它自己却似乎也是一个复杂的框架。这种看法值得我们深入思考。...【详细内容】
2024-03-28  前端达人  今日头条  Tags:Htmx   点击:(22)  评论:(0)  加入收藏
前端工作方式要换了?HTMX简介:无需JavaScript的动态HTML
HTMX允许你使用扩展的HTML语法代替 JavaScript 来实现交互性。HTMX 在标记中直接为你提供HTTP 交互,并支持许多其他交互需求,无需求助于 JavaScript。这是一个有趣的想法,可能...【详细内容】
2023-10-19  大迁世界  微信公众号  Tags:HTMX   点击:(293)  评论:(0)  加入收藏
HTMX简介:无需借助JavaScript的动态HTML
译者 | 布加迪审校 | 重楼HTML让您可以使用扩展的HTML语法而不是JavaScript来实现交互性。HTMX直接在标记中为您提供了HTTP交互,它支持其他许多交互要求,无需借助JavaScript。...【详细内容】
2023-10-07    51CTO  Tags:HTML   点击:(374)  评论:(0)  加入收藏
htmx:增强版 HTML 来了!
如今,Web 用户期望得到单页应用(SPA)提供的流畅、动态的体验。然而,创建 SPA 往往需要使用复杂的框架,如 React 和 Vue,学习和使用起来可能比较困难。这就是htmx的用武之地:一种通...【详细内容】
2023-09-03  前端充电宝  微信公众号  Tags:htmx   点击:(222)  评论:(0)  加入收藏
加入GitHub Accelerator,htmlx 2.0 要来了!
本文主要向大家介绍 htmlx 加入 GitHub Accelerator,关于 htmlx 的原理,以前有单独发表过文章介绍: 让 React 代码行数减少78%的 htmlx 有这么神?大家有感兴趣的可以阅读,话不多...【详细内容】
2023-08-25  高级前端进阶  今日头条  Tags:htmlx   点击:(366)  评论:(0)  加入收藏
爬虫解析HTML动态JS,技术应用揭秘
在当今互联网时代,大量的信息都储存在了各种网页中。而对于开发者、数据分析师和研究人员来说,获取并分析这些网页中的数据是非常重要的任务之一。然而,随着技术的不断发展,许多...【详细内容】
2023-06-29  反方向的鱼    Tags:HTML   点击:(220)  评论:(0)  加入收藏
利用ChatGPT辅助处理Html数据
使用chatgpt进行辅助编程首先要清晰描述自己需求,生成代码通过不断调试及优化,最终完成任务。有它,对程序员是好事也是坏事。一、确认功能请编程实现以下功能:1.所有html保存在a...【详细内容】
2023-05-31    51CTO  Tags:Html   点击:(422)  评论:(0)  加入收藏
一篇文章带你学会HTML以及最常用的标签
HTML是一种标记语言,用于创建网页。在本文中,我们将介绍HTML的基础知识,代码写入到本地文件,并以.html结尾,双击浏览器打开就可以查看效果。HTML文档结构HTML文档由标签组成,每个...【详细内容】
2023-05-16  你的老师父  今日头条  Tags:HTML   点击:(374)  评论:(0)  加入收藏
HTML代码混淆技巧:让爬虫无法抓取,保护你的网页!
随着互联网的发展,越来越多的网站开始使用爬虫技术来获取数据。但是,有些网站为了保护自己的数据安全,会对HTML代码进行混淆处理,使得爬虫无法直接抓取数据。本文将介绍HTML代码...【详细内容】
2023-04-13  倪沛童    Tags:HTML   点击:(240)  评论:(0)  加入收藏
HTML5第三节 初学者接触列表标签和div标签以及span标签
<ul> <li>为列表标签此为无序列表<type=“?”> <apuare>正方形<circle>空心圆环 <disc>默认 实心园 <ol> <li>为列表标签此为有序列表<type=“?”> <1> <a> <A>等 <dl> <dt>...【详细内容】
2023-02-07  那般热衷是你  今日头条  Tags:HTML5   点击:(228)  评论:(0)  加入收藏
站内最新
站内热门
站内头条