公式:$(selector).action()
相关网址 https://jquery.cuishifeng.cn/ jQuery.com https://www.w3school.com.cn/jquery/jquery_install.asp
spring boot引入jquery时可以通过:
1、本地引用
//放在static/js下
<script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
2、cdn
<script th:src="@{https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js}"></script>
3、使用thymeleaf引用
<script type="text/javascript" th:src="@{/js/jquery-3.4.1.js}"></script>
4、导包
<!-- jquery-->
<dependency>
<groupId>org.webjars</groupId>
<artifactId>jquery</artifactId>
<version>3.5.1</version>
</dependency>
<script type="text/javascript" th:src="@{/webjars/jquery/3.5.1/jquery.min.js}"></script>
踩坑: springboot中写script脚本无效,原因如下
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript" th:src="@{/js/jquery-3.4.1.js}"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("p").css("background-color","red");
});
$("#alll").click(function (){
alert("helloworld");
});
});
</script>
</head>
<body>
<h2>This is a heading</h2>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
<button type="button">Click me</button>
<a id="alll" href="">sdsd</a>
</body>
</html>
记得要加 $(document).ready(function(){});
不然没效果。
还有,<script>引用尽量在<script>脚本之前,不然会找不到"$"符号
|