I'm learning JQuery. I'm a new Jquery Student as it is seen.
This is my html page:
<html>
<head>
<title>Jquery 1</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$("document").ready(function(){
var num = 0;
$("p").each(function(){
var data = data + $(this:eq(num)).html();
num =+1;
});
alert(data);
});
</script>
</head>
<body>
<p>
Deneme
</p>
<p>
Deneme2
</p>
</body>
</html>
I want to alert all p elements' text. This code not working.. How can i do?
I'm learning JQuery. I'm a new Jquery Student as it is seen.
This is my html page:
<html>
<head>
<title>Jquery 1</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$("document").ready(function(){
var num = 0;
$("p").each(function(){
var data = data + $(this:eq(num)).html();
num =+1;
});
alert(data);
});
</script>
</head>
<body>
<p>
Deneme
</p>
<p>
Deneme2
</p>
</body>
</html>
I want to alert all p elements' text. This code not working.. How can i do?
Share Improve this question asked Sep 14, 2011 at 16:47 ProgrammerProgrammer 1672 gold badges3 silver badges11 bronze badges 3- 1 When you say 'not working' - what does it do or not do? How is it not working? – glosrob Commented Sep 14, 2011 at 16:48
-
You don't need to use
.each()
if you're just gathering text content. Just use$('p').text()
. – user113716 Commented Sep 14, 2011 at 17:08 - Alright, I'll try not to be, but as long as I continue to exist, I will continue to be, as I can not be and not be at the same time and in the same manner. The only way I could manage to not be would be for me to not exist, which would bring this ment to an abrupt... – user113716 Commented Sep 14, 2011 at 17:21
6 Answers
Reset to default 5Change the code to this:
$("document").ready(function(){
var data = "";
$("p").each(function(index, element) { // note that the .each() handler has two parameters that can be used also
data += $(this).html(); // "this" inside the .each() handler function is the current DOM element in the iteration
});
alert(data);
});
Inside the .each()
handler function, the this
value is the current DOM element in the iteration. Also, the .each()
handler has two parameters on it that can also be used. index
is where you are in the iteration (from 0 to length-1) and element
is the current DOM element (same value as this
).
You can read more about .each()
here.
There is multiple small problems:
- First, declare you
data
variable outside of the callback function, else the variable is only visible inside of the function itself. - replace
$(this:eq(num))
by$(this)
. In jQuery.each's callback,this
is the current element. you don't need the
num
variable$("document").ready(function(){ var data = ''; // data will be visible from inside of the inner function: $("p").each(function(){ data += $(this).html(); // `this` is the current element }); alert(data); });
Try it here: http://jsfiddle/DBme5/
<script type="text/javascript">
$(function(){
var data = "";
$("p").each(function(){
data += $(this).text();
});
alert(data);
});
</script>
may be not just this ?
$("p").each(function(){
alert($(this).text());
});
You don't need .each()
at all if you just have (or want) text content.
alert( $('p').text() );
jQuery will concatenate it for you.
DEMO: http://jsfiddle/8apPN/
If there is nested HTML markup that you want to display, then do this instead:
var html = $.map( $('p'), function(v) { return v.innerHTML; }).join('');
alert( html );
DEMO: http://jsfiddle/8apPN/1/
There are some errors on your code
$(this:eq(num)).html(); // $(this) already refers to the current element,
// so $(this).html() is enough
num =+1; // should be: num += 1
This is a correct version
var data = '';
$( 'p' ).each( function () {
data += $( this ).html();
});
And here's a solution with plain JavaScript
var data = '',
elements = document.getElementsByTagName( 'p' );
for ( var x = 0, len = elements.length; x < len; x += 1 )
{
data += elements[x].innerHTML;
}