JavaScript
둘러보기로 가기
검색하러 가기
JavaScript에 대한 기본적인 사항을 정리한다.
목차
프로그램 문법
주석
- 주석
// 한줄 짜리 주석 /* 여러줄 짜리 주석 */
기본 구문
- var : 변수 선언
var 변수 = 변수값;
- delete : 변수 삭제
delete 변수;
- typeof : 데이터의 type을 문자열로 반환
- Object.prototype.toString.call(변수)를 사용하여 상세한 데이터 타입 구분 가능
typeof 변수 typeof(변수)
- string : string 형
- number : number 형, NaN
- boolean : boolean형
- object : Object(), Array(), null
- function : Function()
- undefined : 값이 지정되지 않는 변수, undefined
- instanceof : obj가 class의 인스턴스인 경우 true를 반환
obj instanceof class
- with
with(obj) { //--- obj.name 이라는 변수를 여기서는 name 이라는 변수명으로 참조 }
- if문
if (조건문) { } else if (조건문) { } else { }
- in : data에 item이 포함되어 있으면 true를 반환
item in data
- ? : 삼항 연산자
- 조건문이 true이면 참값이 false이면 거짓값이 실행 또는 반환됨
(조건문) ? 참값 : 거짓값 var 변수 = (조건문) ? 참값 : 거짓값
- switch문
switch (변수) { case 값1: break; default: break; }
- for문
for (var idx = 0; idx < length; idx++) { //--- continue, break } for (var item in data) { //--- item, data[item] }
- while문
while (조건문) { //--- continue, break }
- do while문
do { //--- continue, break } while (조건문);
- 기타 유용한 구문
//--- aa가 true인 값을 가지면 aa를 저장하고, 그렇지 않으면 bb를 저장 var 변수 = aa || bb //--- aa()가 true인 값을 반환하면 aa()만 실행하고, 그렇지 않으면 bb()도 실행 aa() || bb() //--- aa()가 false인 값을 반환하면 bb()도 실행하고, 그렇지 않으면 aa()만 실행 aa() && bb() //--- 변수를 boolean형으로 형변환 !!변수
오류 처리
- 오류 수집
try { } catch(ex) { } finally { }
- 사용자 정의 Exception
function MyException(str) { this.str = str } throw New MyException("~");
소스 보기
- view-source:http://~
ECMAScript Built-In Library
- 기본형
- string : 문자형
- number : 숫자형
- boolean : 논리형
- 0, 빈 문자열 (""), 수가 아님을 뜻하는 NaN, null, undefined는 모두 false임
- 내장 상수 및 변수
- undefined : null, 변수의 초기값이 없음
- NaN : 0, 숫자가 아님
- Infinity : 0, 무한한 값
- 예약어
- null : 값이 없음
- undefined : 값이 정의되지 않음
- this
- 일반 함수 호출 : this는 전역 객체 (Global)를 참조
- 브라우저에서 전역 객체는 window 임
- 객체의 함수 호출 : this는 해당 객체를 참조
- 생성자 : this는 새로 생성되는 객체를 참조
- call(), apply(), bind() : this는 첫번째 인자를 참조
func.call(obj, arg1, arg2); //--- this는 obj를 지정함, obj.func(arg1, arg2) func.apply(obj, [arg1, arg2]); //--- this는 obj를 지정함, obj.func(arg1, arg2) bind(obj, arg1, arg2); //--- 향후 함수 호출시, this는 obj를 지정함
- Event Handler : this는 이벤트가 발생한 Element를 참조
- Scope
- var로 변수 선언시 외부에서 참조 불가
- this.변수 형태로 변수 선언시 외부에서 참조 가능 (public 접근 제어자 역할)
- 예약어 문법
- JavaScript 문법 체크를 상세하게 처리
'use strict';
- debugger : JavaScript Console을 띄워 놓았을 경우, debugger가 기술된 라인부터 debuging 시작
- F10 : 라인 단위로 실행
- F11 : 함수 호출이 있는 경우, 해당 함수를 라인 단위로 실행
- Shift_F11 : 함수를 호출한 라인으로 돌아가서 실행
- F8 : 다음 breakpoint까지 실행
~ debugger //--- 이 라인부터 debugging을 시작 합니다. ~
- 내장 함수
- eval(string) : 문자열을 JavaScript 코드로서 실행
- parseInt(string,radix) : 문자열을 숫자(정수)로 변환
- 문자열이 0으로 시작하면 8진수로 처리
- 문자열이 0x로 시작하면 16진수로 처리
- parseFloat(string) : 문자열을 숫자(실수)로 변환
- 문자열이 123e3 이면 123 * 1000 = 123000 으로 처리
- isNaN(number) : true. number가 NaN임
- isFinite(number) : true. number가 유한한 값
- escape(string) : 알파벳 숫자 @ * - _ + . / 외의 문자를 인코딩 (유니코드로 인코딩)
- 1바이트 문자 인코딩 : %XX
- 2바이트 문자 인코딩 : %uXXXX
- unescape(string) : escape()의 역함수
- encodeURI(URI) : escape()에서 URI에 사용되는 문자(: ; / = ? &)는 인코딩하지 않음 (UTF-8로 인코딩)
- decodeURI(encodedURI) : encodeURI()의 역함수
- encodeURIComponent(uriComponent) : 알파벳과 숫자를 제외한 모든 문자를 인코딩 (UTF-8로 인코딩)
- decodeURIComponent(uriComponent) : encodeURIComponent()의 역함수
- UTF-8로 인코딩된 parameter을 서버(Java)에서 받는 방법
request.setCharacterEncoding("utf-8"); String name = request.getParameter("name");
내장 객체
- Object()
- String() instanceof Object()
- Number() instanceof Object()
- Boolean() instanceof Object()
- false 인 값 : 0, NaN, , null, undefined
Boolean(obj) //--- obj를 Boolean 형으로 변환 !!obj //--- obj를 Boolean 형으로 변환
- Array() instanceof Object()
- Function() instanceof Object()
arguments //--- 전달받은 인자의 배열 func.call(obj, arg1, arg2); //--- this는 obj를 지정함, obj.func(arg1, arg2) 실행 func.apply(obj, [arg1, arg2]); //--- this는 obj를 지정함, obj.func(arg1, arg2) 실행 bind(obj, arg1, arg2); //--- 향후 함수 호출시, this는 obj를 지정함
- Date() instanceof Object()
- Math() instanceof Object()
- RegExp() instanceof Object()
- Error(message) instanceof Object()
- EvalError() instanceof Error()
- RangeError() instanceof Error()
- ReferenceError() instanceof Error()
- SyntaxError() instanceof Error()
- TypeError() instanceof Error()
- URIError() instanceof Error()
Object
- Object : 모든 변수의 기본이 되는 Class
- 생성자 : {}, new Object(), Object.consturct()
- hasOwnProperty(name)
- isPrototypeOf(obj)
- propertyIsEnumerable(name)
- toLocaleString(), toString()
- valueOf()
var remote = new Object(); Object.constructor : 생성자 Object.prototype (객체의 properties) this { name:"value" }, varname["name"], varname.name
String
- String : Object의 인스턴스
- 생성자 : , new String()
- length
- fromCharCode(charCode)
- charAt(position)
- charCodeAt(position) : code = charCodeAt(int);
- concat(value)
- indexOf(searchString, startPosition)
- lastIndexOf(searchString, startPosition)
- localeCompare(str)
- match(regexp)
- replace(regexp, replaceValue)
- search(regexp)
- slice(start, end)
- split(separator, limit)
- substring(start, end) : substring(a = 0, 1, ..., b = 자를 길이)
- toLocaleLowerCase(), toLowerCase()
- toLocaleUpperCase(), toUpperCase()
CharAt(num) sVal = String.substring(iStart,iEnd); sVal = String.substr(iStart,iLength);
Number
- Number : Object의 인스턴스
- 생성자 : new Number()
- MIN_VALUE, MAX_VALUE
- NEGATIVE_INFINITY, POSITIVE_INFINITY
- NaN
- toExponential(fractionDigits)
- toFixed(fractionDigits)
- toPrecision(fractionDigits)
Boolean
- Boolean : Object의 인스턴스
- 생성자 : new Boolean()
Array
- Array : Object의 인스턴스
- 생성자 : [], new Array()
- length
- concat(args)
- join(seperator)
- pop()
- push(args)
- reverse()
- shift()
- slice(start, end)
- sort(func) : sort(비교함수(a, b)); return a - b;
- splice(start, deletecount, items)
- unshift(start)
var theArray = new Array(7), new Array(); var theArray = new Array("a", "b", "c"); array.length theArray.a, theArray["a"] theArray.push("aaa"); theArray.join(delimiter), reverse(), [ "value" ], varname[0]
Function
- Function : Object의 인스턴스
- 생성자 : new Function(), function() { }
- length
- apply(thisObject, argArray)
- call(thisObject, args)
function makeArray(n) { this.length = n; var args = makeArray.arguments; args[0], args.length return this; }
Date
- Date : Object의 인스턴스
- 생성자 : new Date(s)
- parse(string)
- UTC(hour, min, sec, ms)
- getDate(), getFullYear(), getMonth(), getDay(), getTimeZoneOffset()
- getTime(), getHours(), getMinutes(), getSeconds(), getMilliseconds(),
- setDate(date), setFullYear(year, month, date), setMonth(month, date)
- setTime(value), setHours(hour, min, sec, ms), setMinutes(min, sec, ms), setSeconds(sec, ms), setMilliseconds(value)
- getUTCDate(), getUTCFullYear(), getUTCMonth(), getUTCDay()
- getUTCHours(), getUTCMinutes(), getUTCSeconds(), getUTCMilliseconds()
- setUTCDate(date), setUTCFullYear(year, month, date), setUTCMonth(month, date)
- setUTCHours(hour, min, sec, ms), setUTCMinute(min, sec, ms), setUTCSeconds(sec, ms), setUTCMillseconds(ms)
- toDateString(), toLocaleDateString(), toLocaleString()
- toTimeString(), toLocaleTimeString()
- toUTCString()
- valueOf()
var theDate = new Date(), date(yy, mm, dd); theDate.getYear() + 1900, getMonth() + 1, getDate() + 1, getDay(); theDate.setYear(), setMonth(), setDate(), setDay(); getFullYear(); var today = new Date(); var strToday = today.getYear() + "." + (today.getMonth() + 1) + "." + today.getDate();
Math
- Math : Object의 인스턴스
- 생성자 : new Math()
- E, LN2, LN10, LOG2E, LOG10E, PI, SQRT2, SQRT1_2
- ceil(x) : 올림, floor(x) : 내림, round(x) : 반올림
- abs(x) : 절대값
- random() : 0 < random() < 1
- min(args), max(args)
- log(x)
- exp(x), pow(x, y), sqrt(x)
- sin(x), cos(x), tan(x), asin(x), acos(x), atan(x), atan2(x, y)
abs(~), max(~, ~), min(~, ~)
RegExp
- 생성자 : RegExp, /~/
- source, global, ignoreCase, lastIndex, multiline
- exec(string)
- test(string)
Error
- Error : Object의 인스턴스
- 생성자 : new Error(message)
- name, message
- Error(message) instanceof Object()
- EvalError() instanceof Error()
- RangeError() instanceof Error()
- ReferenceError() instanceof Error()
- SyntaxError() instanceof Error()
- TypeError() instanceof Error()
- URIError() instanceof Error()
ECMA 3 Browser Support Library
- start(index)
- end(index)
- Event instanceof Object
- EventListener instanceof Object
- EventTarget instanceof Object
- Window instanceof EventTarget
- Node instanceof EventTarget
- CharacterData instanceof Node
- Text
- CDATASection
- Comment
- ProcessingInstruction instanceof Node
- Notation instanceof Node
- Document instanceof Node
- HTMLDocument
- DocumentFragment instanceof Node
- DocumentType instanceof Node
- Entity instanceof Node
- EntityReference instanceof Node
- Attr instanceof Node
- Element instanceof Node
- HTMLElement instance Element
- HTMLAnchorElement
- HTMLAppletElement
- HTMLAreaElement
- HTMLAudioElement
- HTMLBaseElement
- HTMLBaseFontElement
- HTMLBodyElement
- HTMLBRElement
- HTMLButtonElement
- HTMLDirectoryElement
- HTMLDivElement
- HTMLDListElement
- HTMLFieldSetElement
- HTMLFontElement
- HTMLFormElement
- HTMLFrameElement
- HTMLFrameSetElement
- HTMLHeadElement
- HTMLHeadingElement
- HTMLHRElement
- HTMLHtmlElement
- HTMLIFrameElement
- HTMLImageElement
- Image
- HTMLInputElement
- HTMLIsIndexElement
- HTMLLabelElement
- HTMLLegendElement
- HTMLLIElement
- HTMLLinkElement
- HTMLMapElement
- HTMLMediaElement
- HTMLMenuElement
- HTMLMetaElement
- HTMLModElement
- HTMLObjectElement
- HTMLOListElement
- HTMLOptGroupElement
- HTMLOptionElement
- Option
- HTMLParagraphElement
- HTMLParamElement
- HTMLPreElement
- HTMLQuoteElement
- HTMLScriptElement
- HTMLSelectElement
- HTMLStyleElement
- HTMLTableCaptionElement
- HTMLTableCellElement
- HTMLTableColElement
- HTMLTableElement
- HTMLTableRowElement
- HTMLTableSelectionElement
- HTMLTextAreaElement
- HTMLTitleElement
- HTMLUListElement
- HTMLVideoElement
- NodeList instanceof Object
- HTMLCollection instanceof Object
- HTMLOptionsCollection instanceof Object
- BarProp instanceof Array
- Coordinates instanceof Object
- CSS2Properties instanceof Object
- DOMException instanceof Object
- DOMImplementation instanceof Object
- Geolocation instanceof Object
- History instanceof Object
- Location instanceof Object
- MediaError instanceof Object
- NamedNodeMap instanceof Object
- Navigator instanceof Object
- Position instanceof Object
- PositionError instanceof Object
- PositionOptions instanceof Object
- Screen instanceof Object
- Storage instanceof Object
- TimeRanges instanceof Object
- WebSocket instanceof Object
- XMLHTTPRequest instanceof Object
Event
- Event
- CAPTURING_PHASE, AT_TARGET, BUBBLING_PHASE
- type, target, currentTarget
- eventPhase, bubbles, cancelable, timeStamp, stopPropagation, preventDefault
- initEvent(eventTypeArg, canBubbleArg, cancelableArg)
- preventDefault()
- stopPropagation()
- EventListener
- 생성자 : new EventListener()
- handleEvent(event)
- EventTarget
- 생성자 : new EventTarget()
- dispatchEvent(event)
- addEventListener(type, listener, useCapture)
- removeEventListener(type, listener, useCapture)
Node
- Node instanceof EventTarget
- ELEMENT_NODE : 1, ATTRIBUTE_NODE, TEXT_NODE, CDATA_SECTION_NODE, ENTITY_REFERENCE_NODE
- ENTITY_NODE, PROCESSING_INSTRUCTION_NODE, COMMENT_NODE, DOCUMENT_NODE, DOCUMENT_TYPE_NODE
- DOCUMENT_FRAGMENT_NODE, NOTATION_NODE
- ownerDocument : HTMLDocument()
- nodeName, nodeValue, nodeType
- parentNode, childNodes, firstChild, lastChild
- previousSibling, nextSibling
- attributes : NamedNodeMap()
- namespaceURI, prefix, localName
- 생성자 : new Node()
- cloneNode(deep)
- appendChild(newChild)
- insertBefore(newChild, refChild)
- replaceChild(newChild, oldChild)
- removeChild(oldChild)
- hasChildNodes()
- hasAttributes()
- isSupported(feature, version)
- normalize()
- NamedNodeMap
- 생성자 : new NamedNodeMap()
- length
- getNamedItem(name), getNamedItemNS(namespaceURI, localName)
- item(index)
- removeNamedItem(name), removeNamedItemNS(namespaceURI, localName)
- setNamedItem(arg), setNamedItemNS(arg)
Document
- Document
- defaultView, doctype
- styleSheets
- implementation : DOMImplementation()
- documentElement : HTMLElement()
- 생성자 : new Document()
- createAttribute(name), createAttributeNS(namespaceURI, qualifiedName)
- createCDATASection(data)
- createComment(data)
- createDocumentFragment()
- createElement(tagName), createElementNS(namespaceURI, qualifiedName)
- createEntityReference(name)
- createEvent(eventType)
- createProcessingInstruction(target, data)
- createTextNode(data)
- getElementById(elementId)
- getElementsByTagName(tarname), getElementsByTagNameNS(namespaceURI, localName)
- importNode(importedNode, deep)
- querySelector(selectors), querySelectorAll(selectors)
- HTMLDocument
- title, referrer, domain, URL
- cookie, lastModified
- body : HTMLElement()
- images, applets, links, forms, anchors : HTMLCollection()
- 생성자 : new HTMLDocument()
- open(), close()
- getElementsByName(elementName)
- write(text), writeln(text)
Element
HTMLElement
입출력
브라우저 입출력
Cookie 입출력
객체 생성 방법
- 함수를 사용하여 객체 생성
var aa = "global aa"; var ab = "global ab"; var ac = "global ac"; var child = null; var Parent1 = function() { var aa = 'aa'; //--- 외부에서 참조 불가 this.aa1 = function() { return aa; }; this.aa2 = function() { return this.aa; }; this.ab = 'ab'; //--- 외부에서 참조 가능 this.ab1 = function() { return ab; }; this.ab2 = function() { return this.ab; }; }; Parent1.prototype = { aa3: function() { return aa; }, aa4: function() { return this.aa; }, ab3: function() { return ab; }, ab4: function() { return this.ab; }, ac: 'ac' , //--- this.ac처럼 외부에서 참조 가능 ac1: function() { return ac; }, ac2: function() { return this.ac; }, }; child = new Parent1(); console.log("aa : " + child.aa); //--- undefined console.log("aa1() : " + child.aa1()); //--- aa console.log("aa2() : " + child.aa2()); //--- undefined (this는 child 참조) console.log("aa3() : " + child.aa3()); //--- Exception : undefined exception (Global 참조) console.log("aa4() : " + child.aa4()); //--- undefined (this는 child 참조) console.log("ab : " + child.ab); //--- ab console.log("ab1() : " + child.ab1()); //--- Exception : undefined exception (Global 참조) console.log("ab2() : " + child.ab2()); //--- ab console.log("ab3() : " + child.ab3()); //--- Exception : undefined exception (Global 참조) console.log("ab4() : " + child.ab4()); //--- ab console.log("ac : " + child.ac); //--- ac console.log("ac1() : " + child.ac1()); //--- Exception : undefined exception (Global 참조) console.log("ac2() : " + child.ac2()); //--- ac
- Object를 사용하여 객체 생성
- prototyp을 사용한 상속 기능이 동작하지 않으므로 상속을 위한 객체 생성용으로는 부적합
var Parent2 = { aa: 'ba', //--- this.ba처럼 외부에서 참조 가능 aa1: function() { return aa; }, aa2: function() { return this.aa; }, ab: 'bb' , ab1: function() { return ab; }, //--- Exception : Unexpected identifier ab2: function() { return this.ab; } }; Parent2.prototype = { //--- Object.create()시 전혀 사용되지 않음 aa3: function() { return aa; }, aa4: function() { return this.aa; }, ab3: function() { return ab; }, ab4: function() { return this.ab; }, ac: 'bc' , ac1: function() { return ac; }, ac2: function() { return this.ac; } }; child = Object.create(Parent2); //--- __proto__만 자동으로 복사됨 console.log("aa : " + child.aa); //--- ba console.log("aa1() : " + child.aa1()); //--- Exception : undefined exception (Global 참조) console.log("aa2() : " + child.aa2()); //--- ba //console.log("aa3() : " + child.aa3()); //--- Exception : undefined is not a function //console.log("aa4() : " + child.aa4()); //--- Exception : undefined is not a function console.log("ab : " + child.ab); //--- bb console.log("ab1() : " + child.ab1()); //--- Exception : undefined exception (Global 참조) console.log("ab2() : " + child.ab2()); //--- bb //console.log("ab3() : " + child.ab3()); //--- Exception : undefined is not a function //console.log("ab4() : " + child.ab4()); //--- Exception : undefined is not a function console.log("ac : " + child.ac); //--- undefined //console.log("ac1() : " + child.ac1()); //--- Exception : undefined is not a function //console.log("ac2() : " + child.ac2()); //--- Exception : undefined is not a function
유용한 라이브러리
JSON을 String으로 변환
function JSONtoString(arg) { var rtStr = ""; var flagStart = true; if (typeof(arg) == "object"){ if (typeof(arg.length) == "number") { rtStr = "["; for (name in arg) { if (flagStart) { flagStart = false; } else { rtStr = rtStr + "," } rtStr = rtStr + JSONtoString(arg[name]); } rtStr = rtStr + "]"; } else { rtStr = "{"; for (name in arg) { if (flagStart) { flagStart = false; } else { rtStr = rtStr + "," } rtStr = rtStr + '"' + name + '":'; rtStr = rtStr + JSONtoString(arg[name]); } rtStr = rtStr + "}"; } } else { return '"' + arg + '"'; } return rtStr; }
데이터 모델
InnerHTML Model
- this.innerHTML = str;
- this.innerText = str;
- this.outerHTML = str;
- this.outerText = str;
- this.insertAdjacentHTML(,);
- this.insertAdjacentHTML("beforebegin", str);
- this.insertAdjacentHTML("afterbegin", str);
- this.insertAdjacentHTML("beforeend", str);
- this.insertAdjacentHTML("afterend", str);
- insertAdjacentText(,);
- this.insertAdjacentText("beforebegin", str);
- this.insertAdjacentText("afterbegin", str);
- this.insertAdjacentText("beforeend", str);
- this.insertAdjacentText("afterend", str);
Element Model
- this.parentElement;
- this.children;
- this.contains(node);
- bodyElement = document.getChildNodes().item(0).getChildNodes().item(1);
- bodyElement = document.getFirstChild().getFirstChild().getNextSibling();
- typeInt = bodyElement.getNodeType()
- elementName = bodyElement.getNodeName();
- elementContent = bodyElement.getFirstChild().getNodeValue();
- var td = xCreateElement("td");
- linkText = document.createTextNode("edit");
- tr.appendChild(td);
- oldNode = theDiv.firstChild.nextSibling.nextSibling;
- theDiv.removeChild(oldNode);
- newNode = document.createTextNode(newText);
- theDiv.appendChild(newNode);
- theDiv.replaceChild(newNode, oldNode);
- theDiv.firstChild.nextSibling.nextSibling.nodeValue=newText;
Document All Model
- window.document.all["idVal"]
- window.document.all.idVal
- var tagH2 = window.document.all.tags("H2");
- var tags = window.document.getElementsByTagName('input');
- tagH2[0, 1, 2 . . .]
- this.getElementsByTagName("*");
- formElement = window.document.getElementById("noteForm");
JSDT
사용자 정의 라이브러리
getInt(argValue, argDefault)
function getInt(argValue, argDefault) { if (arguments.length == 1) { return Math.round(getFloat(argValue, 0.0)); } else { return Math.round(getFloat(argValue, argDefault)); } }
getFloat(argValue, argDefault)
function getFloat(argValue, argDefault) { if (arguments.length == 1) { return getFloat(argValue, 0.0); } if (argValue) { if (typeof argValue === "number") { return argValue; } else { return parseFloat(argValue); } } else { return argDefault; } }
funcGetProcMonth(argStart, argMonth)
function funcGetProcMonth(argStart, argMonth) { var tmpDateStart = null, tmpDateCalc = null; tmpDateStart = new Date(argStart.getYear(), argStart.getMonth() + argMonth, 1); tmpDateCalc = new Date(argStart.getYear(), argStart.getMonth() + argMonth, argStart.getDate()); if (tmpDateStart.getMonth() == tmpDateCalc.getMonth()) { return tmpDateCalc; } else { return new Date(argStart.getYear(), argStart.getMonth() + argMonth + 1, 0); } }
funcFormatInt(argInt)
function funcFormatInt(argInt) { return funcFormatIntStr(argInt + ""); } function funcFormatIntStr(argIntStr) { if (argIntStr.length < 4) { return argIntStr; } else { return funcFormatIntStr(argIntStr.substr(0, argIntStr.length - 3)) + "," + argIntStr.substr(argIntStr.length - 3); } }
Frame에서 화면 중앙 정열
function getMarginLeft() { var widthScreen = window.document.body.clientWidth; if (widthScreen < 1000) { return 0; } else { return Math.round((widthScreen - 1000) / 2); } } // scrollWidth, clientWidth, offsetWidth function funcResize() { var leftMargine = getMarginLeft(); window.headerFrame.document.body.style.marginLeft = leftMargine + "px"; } window.onload = funcResize; window.onresize = funcResize; window.onload = function() { allFrame.cols = window.top.getMarginLeft() + ",200,*"; } window.onresize = function() { allFrame.cols = window.top.getMarginLeft() + ",200,*"; } <frameset cols="0,200,*" border="0" frameborder="0" framepadding="0" framespacing="0" marginwidth="0" marginheight="0" id="allFrame">