概述
第一种方法
<!DOCTYPE html>
<html lang="en" style="height: 100%">
<head>
<meta charset="UTF-8">
<title>引入函数</title>
<meta http-equiv="refresh" content="10;url=http://localhost:8080/ab">
<link rel="stylesheet" href="../static/css/blogsheet.css">
<script type="text/javascript" src="../static/js/lib/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="../static/js/lib/jquery.url.js"></script>
<script>
window.onload = function () {
fff()
}
function fff() {
alert("hahhh")
}
</script>
</head>
<body style="width: 100%;height: 100%">
{{template "header"}}
<div class="container" style="width: 100%;min-height: 100%;background-color: rgba(255,187,5,0.22)">
<div style="width: 100%;height: 100%;padding-bottom: 50px;background-color: #ff552f"></div>
</div>
{{template "footer"}}
</body>
</html>
核心代码
<script>
window.onload = function () {
fff()
}
function fff() {
alert("hahhh")
}
</script>
这样加载页面时函数fff()就会被调用执行。
当然，直接在第一段内容中写函数逻辑也可以，比如这样
<script>
window.onload = function () {
alert("?哈哈哈哈哈");
ffff();
}
function ffff() {
alert("哈哈哈哈")
}
</script>
第二种方法
<!DOCTYPE html>
<html lang="en" style="height: 100%">
<head>
<meta charset="UTF-8">
<title>引入函数</title>
<meta http-equiv="refresh" content="10;url=http://localhost:8080/ab">
<link rel="stylesheet" href="../static/css/blogsheet.css">
<script type="text/javascript" src="../static/js/lib/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="../static/js/lib/jquery.url.js"></script>
<script>
$(function(){
alert("哈哈哈哈哈哈哈")
})
</script>
</head>
<body style="width: 100%;height: 100%">
{{template "header"}}
<div class="container" style="width: 100%;min-height: 100%;background-color: rgba(255,187,5,0.22)">
<div style="width: 100%;height: 100%;padding-bottom: 50px;background-color: #ff552f"></div>
</div>
{{template "footer"}}
</body>
</html>
核心代码
<script>
$(function(){
alert("哈哈哈哈哈哈哈")
})
</script>
这样就是直接在加载页面时，执行该匿名函数。
第三种方法
<!DOCTYPE html>
<html lang="en" style="height: 100%">
<head>
<meta charset="UTF-8">
<title>引入函数</title>
<meta http-equiv="refresh" content="10;url=http://localhost:8080/ab">
<link rel="stylesheet" href="../static/css/blogsheet.css">
<script type="text/javascript" src="../static/js/lib/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="../static/js/lib/jquery.url.js"></script>
<script>
function fff() {
alert("啊哈哈哈哈哈哈")
}
</script>
</head>
<body style="width: 100%;height: 100%" onload="fff()">
{{template "header"}}
<div class="container" style="width: 100%;min-height: 100%;background-color: rgba(255,187,5,0.22)">
<div style="width: 100%;height: 100%;padding-bottom: 50px;background-color: #ff552f"></div>
</div>
{{template "footer"}}
</body>
</html>
核心代码
<script>
function fff() {
alert("啊哈哈哈哈哈哈")
}
</script>
<body style="width: 100%;height: 100%" onload="fff()">
</body>
这种方法需要在body标签中使用onload="函数名()"进行调用。
不过，这几种方法在使用时略有区别。
最后
以上就是醉熏水池为你收集整理的html模板里引入js函数的几种方法的全部内容，希望文章能够帮你解决html模板里引入js函数的几种方法所遇到的程序开发问题。
如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。
本图文内容来源于网友提供，作为学习参考使用，或来自网络收集整理，版权属于原作者所有。
发表评论 取消回复