본문 바로가기
728x90
반응형

개발/html,Thymeleaf14

Jquery Selector 성능에 관한 고찰 1.Append Outside of Loops나쁜 예 $.each(myArray, function(i, item){var newListItem = "" + item + "";$("#list").append(newListItem);});이 경우 ul#list에 하나하나의 엘레먼트를 붙이는 작업이다.배열의 엘레먼트 갯수가 많아아지는 경우 DOM을 조작해야하는 비용적인 측명에서 과소비가 일어나게 된다. 바른 예 var myHtml=""; $.each(myArray, function(i, item){var myHtml += "" + item + ""; });$("#list").html(myHtml); 2.Cache Length During Loops나쁜 예for(var i =0;i 2017. 3. 8.
자바스크립트 턴제 게임 만들기 test2.html Start 1. Adventour 2. Healing 3. Exit Input 1. Attack 2. Healing 3. escape Input test2Js.js var TurnGame = (function(){ var instance; var initiate = function(heroName){ var hero = { name : heroName, lev : 1, maxHp: 100, hp : 100, xp : 0, att : 10 }; var monsters =[{ name : "Slime", hp : 25 + hero.lev *3, att : 10 +hero.lev, xp : 10 + hero.lev },{ name : 'Skelleton', hp : 50 + hero.lev.. 2016. 12. 15.
javascript 테트리스 만들기 test.html score: 0 testJs.js var fs = "1111:01|01|01|01*011|110:010|011|001*110|011:001|011|010*111|010:01|11|01:010|111:10|11|10*11|11*010|010|011:111|100:11|01|01:001|111*01|01|11:100|111:11|10|10:111|001", now = [3,0], pos = [4,0];var gP = function(x,y) { return document.querySelector('[data-y="'+y+'"] [data-x="'+x+'"]'); };var draw = function(ch, cls) { var f = fs.split('*')[now[0]].split(':.. 2016. 12. 13.
자바스크립트 이벤트 바인딩 1.Event binding루트 요소의 특정 집합을 기반으로 지금 또는 나중에, 선택과 일치하는 모든 요소에 대해 하나 이상의 이벤트 처리기를 묶는 것을 말한다.1.1 HTML Event Handler 더이상 사용되지 않으며 HTML과 JavaScript를 분리 되어있어야 한다. 결과 1.2 전통적(Traditional) DOM Event Handler HTML Event Handler처럼 Html과 JavaScript가 혼용되는 문제는 해결되었으나 이벤트 핸들러에 하나의 함수만 바인딩 할 수 있으며 함수에 인수를 전달할 수 없는 단점이 있다. Click me 결과 1.3 DOM Level 2 Event ListenerEvent Listener는 이벤트를 처리하는 가장 최신의 기법이다. 이벤트 리스너를 .. 2016. 5. 30.
728x90
반응형

티스토리툴바