javascript over view Tech-zadu

change html using javascrip
document.getElementById("id").innserHTML = "html"
change html attributes using javasctip.
   documnet.getElementById("id").src= "src"
change html style
   doucument.getEelemnntById("id").style.fontsize ="12px"
.style.display = "none"
.style.display = "block"
javascript posibilities
1.alert
2.console
3.document.wirte
4.innerHTML

javascript bitwise operators

1.& (and)
2.| (or)
3.^ (xor)
4.<< (zero fill left shift)
5.>>(zero fill right sift)

javascript evalute expression (javascript evaluate expression form left to right)
var x = 5+"me" //output = 5me
var x = 5+5+"me" output = 10me
var x = "me"+5+5 output = me55

null vs undefined
type object - type undefined

null === undefineed //false
null == undefined //true

javascript events
1.onclick
2.onchnage
3.onMouseover
4.onMouseOut
5.onKeydown
6.onLoad

javascript strings
string.lenght
string.toUpperCase();
string.toLowwerCase();

Method used to debug
Console.log();

To Sennd Data to server
var myobj = {'key': 'value', 'Key1': "value2"}
to send server = var myobj = JSON.stringify(myobj)
to receive -> JSON.parse(myobj)
to get values -> myobj.name

storage in javascript
localStorage.setItem(key,value)
localStorage.getItem(key)

javascript Ajax

var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystateChange = function(){
if(this.readyState == 4 && this.status ==200)
                                  {
//do operations
                                      }
                                  }
xmlhttp.open(get/post,url,true)
xmlhttp.send()

testdome questions

>Function appendChildren should add a new child div to each existing div. New divs should be decorated by calling decorateDiv.

<div id="a">
    <div id="b">
    </div>
  </div>

solution:

function appendChildren() {
  var allDivs = document.getElementsByTagName("div");

  for (var i = 0; i < allDivs.length; i++) {
    var newDiv = document.createElement("div");
    decorateDiv(newDiv);
    allDivs[i].appendChild(newDiv);
  }
}

// Mock of decorateDiv function for testing purposes
function decorateDiv(div) {}

> Fix the bugs in the registerHandlers function. An alert should display anchor's zero-based index within a document instead of following the link.

For example, in the document below, the alert should display "2" when Google anchor is clicked since it is the third anchor element in the document and its zero-based index is 2.

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Test page</title>
  </head>
  <body>
    In my life, I used the following web search engines:<br/>
    <a href="//www.yahoo.com">Yahoo!</a><br/>
    <a href="//www.altavista.com">AltaVista</a><br/>
    <a href="//www.google.com">Google</a><br/>
  </body>
</html>

solution:

function registerHandlers() {
  var as = document.getElementsByTagName('a');
  for (var i = 0; i < as.length; i++) {
    as[i].onclick =  (function(i){return function(){alert(i); return false;}}(i))
      
  }
}

> With the new HTML5 features, modify the form so that:

The formula input field has an autocomplete option with the following options: "sin", "cos", "tan" and "cot".
The iterations input field is a slider with possible values from 1 to 10.
The precision input field is a number picker with possible values from 1 to 100, where 50 is the default value.

solution:
Formula:
      <datalist id="op">
        <option value="sin">
          <option value="cos">
            <option value="tan">
              <option value="cot">
      </datalist>
      <input name="formula" list="op">
      <br /> Iterations:
      <input name="iterations" type="range" min="1" max="10" step="1" />
      <br /> Precision:
      <input name="precision" type="number" min="1" max="100" value="50" />
      <br />

Search

Content