Jquery syntax information required -
i learning jquery , on first example of chapter 4 of learning jquery. have 2 queries. 1) while checking id of button clicked using this.id , not $(this).id, use $ sign not in this. please explain.
2) while using $speech, tried using $(speech).css , did not work. please let me know reason well.
below code.
<html lang="en"> <head> <title>page 87</title> <link rel="stylesheet" href="04.css" type="text/css" /> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script> $(document).ready(function(){ var $speech=$("div.speech"); $("#switcher-default").click(function(){ $("#switcher button").removeclass("selected"); $(this).addclass("selected"); $speech.css('fontsize','1em'); }); $("#switcher button").click(function(){ $("#switcher button").removeclass("selected"); $(this).addclass("selected"); var num=parsefloat($speech.css('fontsize')); if(this.id=='switcher-large') { num*=1.4; } else if(this.id=='switcher-small') { num/=1.4; } $speech.css('fontsize',num+'px'); }); }); </script> </head> <body> <div id="container"> <h2>abraham lincoln's gettysburg address</h2> <div id="switcher"> <div class="label">text size</div> <button id="switcher-default">default</button> <button id="switcher-large">bigger</button> <button id="switcher-small">smaller</button> </div> <div class="speech"> <p>fourscore , 7 years ago our fathers brought forth on continent new nation, conceived in liberty, , dedicated proposition men created equal.</p> <p>now engaged in great civil war, testing whether nation, or nation conceived , dedicated, can long endure. met on great battlefield of war. have come dedicate portion of field final resting-place here gave lives nation might live. altogether fitting , proper should this. but, in larger sense, cannot dedicate, cannot consecrate, cannot hallow, ground.</p> <a href="#" class="more">read more</a> <p>the brave men, living , dead, struggled here have consecrated it, far above our poor power add or detract. world little note, nor long remember, here, can never forget did here. living, rather, dedicated here unfinished work fought here have far nobly advanced.</p> <p>it rather here dedicated great task remaining before us—that these honored dead take increased devotion cause gave last full measure of devotion—that here highly resolve these dead shall not have died in vain—that nation, under god, shall have new birth of freedom , government of people, people, people, shall not perish earth.</p> </div> </div> </body> </html>
this reference html dom element source of event.
$(this) jquery wrapper around element enables usage of jquery methods.
$(this).attr('id') , this.id same
but if element has no id, this.id return blank string
$(this).attr('id') return undefined
$(this).id,//this wrong syntax ,,,actually $(this).attr('id')
this used same id or class,which have use before in event.
$('#five').click(function() { $(this).height();// here means #five(same id clicked ) } and in var $speech=$("div.speech");
$speech.css('fontsize','1em'); //this correct syntax. same $("div.speech").css('fontsize','1em'); $(speech).css //this wrong
Comments
Post a Comment