user2730833
user2730833

Reputation: 183

changing paragraph fontsize using java script

I am very new in learning JavaScript and html and CSS, I am trying to change the size of the all paragraphs in the document object here is my code but I am not getting any change and I noticed that documnet.getElementsByTagName('p') returns an empty object

 <html>
  <head>
    <script> 
       window.onload=function(){
       var paragraphs = document.getElementsByTagName("p");
       for(var i = 0; i < paragraphs.length; i++){
        paragraphs[i].style.fontSize = '45px';      
       } 
       }
    </script>
  </head>
  <body> 
     <p>helooop</p>
     <p>helooop</p> 
     <p>helooop</p>
     <p>helooop</p> 
  </body>

I don't know where went wrong . Could anyone helps please

Upvotes: 1

Views: 1708

Answers (4)

Anto Jurković
Anto Jurković

Reputation: 11258

Yes, code is working but it seems that there is some hidden character in the line with for() command which prevents proper parsing. I cut&paste the code to Chrome and it reported:

Uncaught SyntaxError: Unexpected token ILLEGAL 

I had to strip everything in front and after for() command to make it work.

Actually, lines 5 - 8 contain mix of 0020 and 3000 characters in front of text. Because of that both Firefox and Chrome reports SyntaxError.

Somehow you managed to put those chars in. You have to delete those chars in front of text and put there just spaces (or tabs). And your code will work as such.

Upvotes: 0

paka
paka

Reputation: 1641

Use $(document).ready() wrap (or this solution to avoid jQuery $(document).ready equivalent without jQuery)

You code works fine, but script fires before DOM is ready and any «p» is there

UPD

$(document).ready(function(){
      var paragraphs = document.getElementsByTagName("p");
     for(var i = 0; i < paragraphs.length; i++){
       paragraphs[i].style.fontSize = '45px';      
      } 
};

upd2

see coments, sorry =)

Upvotes: 0

HIRA THAKUR
HIRA THAKUR

Reputation: 17757

      window.onload = function () {    
      var paragraphs = document.getElementsByTagName("p");    
      for (var i = 0; i < paragraphs.length; i++) {    
      paragraphs[i].style.fontSize = '3em';    
       }
      }

since you are increasing fontsize onload(which does not make sense to me),why not try this in your css itself:

* {
    font - size: 3em!important;
    color: #000 !important;
   font-family: Arial !important;
   }

Upvotes: 1

Sridhar R
Sridhar R

Reputation: 20418

The code is working fine

var paragraphs = document.getElementsByTagName("p");    
for (var i = 0; i < paragraphs.length; i++) {    paragraphs[i].style.fontSize = '45px';    
}

http://jsfiddle.net/4zvAP/

Upvotes: 0

Related Questions