Много ми допадна тази презентация на възможностите на HTML5, мисля да започна с експериментите:
http://apirocks.com/html5/html5.html
Когато ми се наложи да пиша javascript, обикновено гледам да свърша възможно най-бързо и да се върна на приятелска PHP-територия. Затова когато трябваше да напиша динамично добавяне на input елементи, набързо написах първото, което ми хрумна:
-
<div id="band_container'>
-
<div class="label">Favourite band(s):</div>
-
<div class="text-box"><input type="text" name="bands[]" /></div>
-
<div class="add-button"><a onclick="add_band_input();">add another</a></div>
-
<div class="clear"></div>
-
</div>
-
и съответно в js-файла:
-
function add_band_input() {
-
document.getElementById("band_container").innerHTML += '<div class="label"> </div><div class="text-box"><input type="text" name="bands[]" /></div><div class="clear"></div>';
-
}
Проработи и забравих за него. Няколко дни по-късно забелязах, че ако въведа нещо в input полето и след това натисна линка add another, въведеното от мен изчезва. Това беше проблем. След известно проучване – главно ровене из stackoverflow.com – намерих решение:
-
function add_band_input() {
-
var parentDiv = document.getElementById("band_container");
-
var newDiv1 = document.createElement("div");
-
var newDiv2 = document.createElement("div");
-
var newDiv3 = document.createElement("div");
-
newDiv1.innerHTML = '<div class="label"> </div>';
-
parentDiv.appendChild(newDiv1);
-
newDiv2.innerHTML = '<div class="text-box"><input type="text" name="bands[]" /></div>';
-
parentDiv.appendChild(newDiv2);
-
newDiv3.innerHTML = '<div class="clear"></div>';
-
parentDiv.appendChild(newDiv3);
-
}
Оказа се, че като използвам DOM, кодът е не само по-красив, но и по-стабилен. Това някак ме накара да почувствам непозната до този момент близост с javascript.
За целите на тази статия ми трябваше начин да покажа 2 последователни тирета --. Проблемът беше, че Wordpress „превежда“ двете тирета в едно по-дълго. И после като го копипейстнеш в конзолата, командата не ти работи и псуваш този, който е написал статия без да я тества. Просто е, само пишете --
Сега остава да напиша статия за това как показах кода за двете тирета, вместо да покажа самите тирета…
Източник: Simple Thoughts
Зачетох се е в статията за HTML5 в последния брой на списание .net и ми направи впечатление, че работната група, която разработва стандарта се казва Web Hypertext Application Technology Working Group, съкратено WHATWG, или както аз го чета – WHAT Working Group? (каква работна група?) Сайтът им е whatwg.org и според мен това съкращение нарочно така са го измислили. Вие как мислите?
Колкото до HTML5, препоръчвам ви да си вземете списанието .net. Може също да погледнете този сайт, където има табличка с екстрите на стандарта и доколко се поддържат от браузърите.
за който не знае, javascript функцията document.getElementById (както предполагам и всички започващи с document) не работи, ако не сте сложили body таг на файла. демонстрация можете да видите тук: http://dchakarov.com/document.php. двата линка дават различен резултат (в единия случай функцията не работи), а кодът им се различава само с един таг. ето сорс-кода на демото:
<?php if(isset($_GET["body"])): ?>
<?php if($_GET["body"] == 1): ?>
<body>
<div id=“test_div“></div>
<script>document.getElementById(’test_div’).innerHTML=’някакво съобщение!’</script>
</body>
<?php elseif($_GET["body"] == 0): ?>
<div id=“test_div“></div>
<script>document.getElementById(’test_div’).innerHTML=’някакво съобщение!’</script>
<?php endif ?>
<?php else: ?>
<a href=“?body=0″>без body таг</a> | <a href=“?body=1″>с body таг</a>
<?php endif ?>


