How do I get a value of a <span> using jQuery?
Question
This is basic.
How do I get the value 'This is my name' of the above span?
<div id='item1'>
<span>This is my name</span>
</div>
12 answers
solution1
316 ACCPTED 2009-12-17 12:12:35
I think this should be a simple example:
$('#item1 span').text();
or
$('#item1 span').html();
solution2
14 2009-12-17 12:13:34
$("#item1 span").text();
solution3
7 2009-12-17 12:13:10
假设你打算让它读取 id="item1"，你需要
$('#item1 span').text()
solution4
5 2009-12-17 12:13:01
Since you did not provide an attribute for the 'item' value, I am assuming a class is being used:
<div class='item1'>
<span>This is my name</span>
</div>
alert($(".item span").text());
Make sure you wait for the DOM to load to use your code, in jQuery you use the ready() function for that:
<html>
<head>
<title>jQuery test</title>
<!-- script that inserts jquery goes here -->
<script type='text/javascript'>
$(document).ready(function() { alert($(".item span").text()); });
</script>
</head>
<body>
<div class='item1'>
<span>This is my name</span>
</div>
</body>
solution5
5 2010-08-06 12:42:40
$('#item1').text(); or $('#item1').html(); works fine for id="item1"
solution6
3 2009-12-17 12:43:48
在 javascript 中，您不会使用document.getElementById('item1').innertext吗？
solution7
1 2012-05-21 18:37:40
$('span id').text(); worked with me
solution8
1 2015-06-09 11:23:32
$('#id span').text()就是答案！
solution9
1 2020-03-14 06:36:35
You could use id in span directly in your html.
<span id="span_id">Client</span>
Then your jQuery code would be
$("#span_id").text();
Some one helped me to check errors and found that he used val() instead of text(), it is not possible to use val() function in span. So
$("#span_id").val();
will return null.
solution10
0 2016-04-01 09:47:56
$('#item1 span').html(); Its working with my code
solution11
0 2019-12-06 10:15:56
VERY IMPORTANT Additional info on difference between .text() and .html():
If your selector selects more than one item, eg you have two spans like so <span class="foo">bar1</span> <span class="foo">bar2</span> ,
then
$('.foo').text(); appends the two texts and give you that; whereas
$('.foo').html(); gives you only one of those.
solution12
-2 2017-03-18 10:32:42
<script>
$(document).ready(function () {
$.each($(".classBalence").find("span"), function () {
if ($(this).text() >1) {
$(this).css("color", "green")
}
if ($(this).text() < 1) {
$(this).css("color", "red")
$(this).css("font-weight", "bold")
}
});
});
</script>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.