I can't get the value of the element in spring boot template, my template:
我无法在Spring模板中获取元素的值，我的模板：
$("#article-list .list-item").click(function() {
console.log($("#test").val());
});
$(document).ready(function() {
$("#article-list").css("background-color", "red");
});<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<body>
<ul id="article-list">
<h1 id="test">this is the test content</h1>
<li class="list-item">
<h2 class="article-title">title</h2>
<p class="article-excerpt">content</p>
<span class="article-time">2017-12-22</span>
</li>
<li class="list-item">
<h2 class="article-title">title</h2>
<p class="article-excerpt">content</p>
<span class="article-time">2017-12-22</span>
</li>
</ul>
<script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>
</body>
</html>The value of h1 always null, I can't get it. And, I've tested the jQuery, it works. Using jQuery to change the ul element background color, it's ok. Like this:
h1的值总是为null，我无法得到它。而且，我测试了jQuery，它的工作原理。使用jQuery更改ul元素背景颜色，没关系。喜欢这个：
But I can't get the value of h1
但我无法得到h1的值
1 个解决方案
#1
4
You can't use .val() to get the content of the h1 that is for input and select elements. Use .text() or .html()
您不能使用.val（）来获取用于输入和选择元素的h1的内容。使用.text（）或.html（）
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<title></title>
</head>
<body>
<ul id="article-list">
<h1 id="test">this is the test content</h1>
<li class="list-item">
<h2 class="article-title">title</h2>
<p class="article-excerpt">content</p>
<span class="article-time">2017-12-22</span>
</li>
<li class="list-item">
<h2 class="article-title">title</h2>
<p class="article-excerpt">content</p>
<span class="article-time">2017-12-22</span>
</li>
</ul>
<script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>
<script type="text/javascript">
$("#article-list .list-item").click(function() {
console.log($("#test").text());
});
</script>
</body>
</html>#1
4
You can't use .val() to get the content of the h1 that is for input and select elements. Use .text() or .html()
您不能使用.val（）来获取用于输入和选择元素的h1的内容。使用.text（）或.html（）
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<title></title>
</head>
<body>
<ul id="article-list">
<h1 id="test">this is the test content</h1>
<li class="list-item">
<h2 class="article-title">title</h2>
<p class="article-excerpt">content</p>
<span class="article-time">2017-12-22</span>
</li>
<li class="list-item">
<h2 class="article-title">title</h2>
<p class="article-excerpt">content</p>
<span class="article-time">2017-12-22</span>
</li>
</ul>
<script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>
<script type="text/javascript">
$("#article-list .list-item").click(function() {
console.log($("#test").text());
});
</script>
</body>
</html>