// greet.everyone
What issa “.class”?
I understand id’s n element names, but I don’t understand when I’d speciffy a class for somethin, or how iss used.
// thx.everyone
div elements can have id’s and classes. Ids are unique to one div whereas classes are not unique. So you can either pick a div through its id or through its classname. Either way, you can pick them.
2 Likes
ok, thx vro. I think I get it: id’s n classes serve similar purposes, but id’s r more specific in exactly which element they define?
Is that it, or am I still off?
2 Likes
You’re right about that fact
2 Likes
I really like JQuery. My question after reading is: all examples start with: $(document).ready(function(){
I do not understand why. What is it for?
Thanks team!
1 Like
Hey @Crypila, hope you are well.
Sorry for the delay, now about your question:
$(document).ready(function() is used to execute a logic once your page is loaded, then the code (logic) that you write inside it, will be executed, like adding a function to a button once its clicked (document.getElementById("myButton").onclick = () => doSomething();).
Carlos Z
2 Likes
thank you 
I have a question about next chapter. Is driving me insane not being able to understand.
console.log (“coconuts”.slice (4, 7));
-> nut
Why nut and not nuts? If the 1st character has position 0 why is it not nuts
c o c o n u t s
0 1 2 3 4 5 6 7
Being new to all of this and just now developing a bit of an understanding of everything we have learned up to this point, I have to say that it is very amazing how jQuery brings ordinary one-dimensional HTML, or java script to life! Just to think, the person, or persons, who developed the language of this code structure and the drive they had to want to achieve a better user experience on the web is nothing short of inspirational!
2 Likes
Following on from Guactoshi’s self destruct post, I’ve given it a slightly different twist. For the final segment I used the animate function and tried to set the duration timeout but could not get this to work, so resorted to using the hide feature. Not quite what I wanted but it does suffice. If anyone does have any pointers on getting the duration feature (e.g. animate({duration: 1600})) working, I’d be grateful.
<!DOCTYPE html>
<html>
<head>
<title>Mission Impossible</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
<script type="text/javascript">
setInterval(function(){
$('blink').each(function() {
$(this).toggle();
});
}, 500);
</script>
<br><br>
<button style="background-color: yellow; position: absolute; left: +250px;"
id="missionButton"><blink><b>Click For Incoming Mail</b></blink></button>
<div id="imMessage" style="display:none;font-family:courier;font-size:40px">
Message Reads: Your mission, should you choose to accept it, is to hunt
down and destroy the SARS-CoV-2 virus. Should you and your team fail for
whatever reason, this organisation will disavow all knowledge of your
actions. This message will self-destruct in five seconds!!</div>
<div id="boom" style="display:none; color:red; height:350px; width:100%;
bottom:0px; background-color:black; text-align:center; font-size:300px;
font-family:verdana; font-weight:bold">BOOM!</div>
<script>
$(document).ready(function(){
$('#missionButton').click(function(){
$(this).hide();
$('#imMessage').fadeIn('slow', function(){
$('#imMessage').delay(9000).fadeOut();
$('#boom').delay(9400).animate({"opacity": "show"}).hide(3000);
//$('#boom').show(12000).delay(1000).fadeOut();
//Above line can be used instead of animate to fade in, fade out
});
});
});
</script>
</body>
</html>
1 Like