Usuwanie diva ze strony

 function em_usun(nr) {
  var el = document.getElementById(‚route_em_’+nr);
  el.parentNode.removeChild(el);
 }

div musi posiadac diva parent

<div>
<div id=”route_em_1″>div mapa polski</div>
<div id=”route_em_2″>div mapa polski</div>
</div>

<input type=”button” value=”” onclick=”em_usun(‚1’)”>

Dynamiczne dodanie markera span

<!DOCTYPE HTML PUBLIC „-//W3C//DTD HTML 4.0 Transitional//EN”>
<html>
 <head>
  <title> New Document </title>
  <script src=”debug_js.js” type=”text/javascript”></script>
  <script language=”JavaScript”>
  <!–
 function getE(id) {
  return document.getElementById(id);
 }

 function test() {
  deb_write(deb_prop(getE(‚tests’),true));
 }

 function test2() {
      var div = document.createElement(„span”);
      div.style.font = ’12px Arial, Verdana, Tahoma’;
      div.style.position = „absolute”;
   div.style.background = ‚#fefefe’;
     div.style.padding = ‚2px’;
   div.id = „s1”;
   div.innerHTML = ‚Warszawa, Warszawa, Warszawa, Warszawa’;
   var d2 = getE(‚tests2’);
      d2.appendChild(div);

   deb_write(deb_prop(getE(‚s1’),true));
 }

  //–>
  </script>
 </head>

 <body>
  <div id=”tests”>Polska Warszawa Polska Warszawa</div>
  <div id=”tests2″></div>

  <input type=”button” value=”Test” onclick=”test()”>
  <input type=”button” value=”Test2″ onclick=”test2()”>
 </body>
</html>

Odczyt treści linka

JavaScript:
var el = document.getElementById(‚mapa’);
var el2 = el.getElementsByTagName(‚a’)[0];
var value = el2.innerHTML;
alert(value);

HTML:
<div id=”mapa”><a href=”mapa.html”>mapa strony</a></div>

Wynik:
mapa strony

Odnajdywanie elementów według określonej klasy

var cont = document.getElementById(‚content’).getElementsByTagName(‚div’);
for(i=0;i<cont.length;i++)
if (cont[i].className.match(/^belka/))
  cont[i].style.display = ‚none’;

Przyklad ukrycia elementów, wykorzystanie match:
<div id=”content”>
<div class=”belka”>odnajdywanie klasa belki</div>
<div class=”belka”>odnajdywanie klasa belki></div>
</div>

Współrzędne myszki, pozycja kursora myszki Javascript

<html>
<head>
<script type=”text/javascript”>
var IE = document.all ? true : false;
if (!IE) document.captureEvents(Event.MOUSEMOVE);
document.onmousemove = myMouseXY;
var pX = 0;
var pY = 0;
function myMouseXY(e) {
if (IE) {
 pX = event.clientX + document.body.scrollLeft;
 pY = event.clientY + document.body.scrollTop;
} else {
 pX = e.pageX;
 pY = e.pageY;
}
if (pX < 0) pX = 0;
if (pY < 0) pY = 0;

document.getElementById(„ws”).value = pX+’,’+pY;
document.getElementById(„dymek”).style.left = pX;
document.getElementById(„dymek”).style.top = pY;
return true;
}
</script>
</head>
<body>
<div id=”dymek” style=”position: absolute;”><input type=”text” id=”ws”></div>
</body>
</html>

Kolorowanie rekordów w tabeli

Przypisanie zdarzeń do tagów <td> tabeli


<p class="mce_ws_kod">&lt;script&gt;
function add_tr_hover(id) {
alert(id);
var elem = document.getElementById(id);
var lista = elem.getElementsByTagName('tr');
for(var i=0; i&lt;lista.length; i++) {
lista[i].onmouseover=function() { this.style.backgroundColor='#EDEDED'; }
lista[i].onmouseout=function() { this.style.backgroundColor='#FFFFFF'; }
}
}

<p class="mce_ws_kod">window.onload=function(){
add_tr_hover("cos");
}
<p class="mce_ws_kod">&lt;/script&gt;</p>
Przykładowy HTML tabeli

<span class="mce_ws_kod">&lt;table id="cos"&gt;
&lt;tr&gt;&lt;TD&gt;jeden&lt;/TD&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;TD&gt;dwa&lt;/TD&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;TD&gt;trzy&lt;/TD&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;TD&gt;cztery&lt;/TD&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;TD&gt;pięć&lt;/TD&gt;&lt;/tr&gt;
&lt;/table&gt;</span>

Zmiana rozmiaru mapy

map = new GMap2(document.getElementById(„mapcan”));
…..
map.getContainer().style.width = 500+’px’;
map.getContainer().style.height = 500+’px’;
map.checkResize();

Kod należy umieścić w funkcji JS.
Wywołanie funkcji powoduje zmiane rozmiaru mapy.

Drukowanie fragmentu strony

function print_frag(id) {

 var div;

 div = document.getElementById(id);
 okno = window.open(”, „”, „toolbar=0, location=0, resizable=1, directories=0, status=1, menubar=1, scrollbars=1, height=800, width=700, top=80, left=350′”);
 var html = div.innerHTML;

 html = ‚<html><head><link rel=”stylesheet” href=”http://kody.wig.pl/style.css” type=”text/css” /></head><body>’+html+'</body></html>’;

 okno.document.write(html);
 //okno.print();
 okno.focus();
}
<a href=”javascript:print_content(‚fragment’)” mce_href=”javascript:print_frag(‚fragment’)”><b>Drukuj</b></a>