반응형
m.logPrint() is working!
<eq> and <eqq> tags are rendered to MathJax format, being enclosed by \ ( \ ) and \ [ \ ].
docuK1 scripts started!
If this log is not closed automatically, there must be an error somewhere in your document or scripts.
Table of Contents is filled out.
Auto numberings of sections (div.sec>h2, div.subsec>h3, div.subsubsec>h4), <eqq> tags, and <figure> tags are done.
<cite> and <refer> tags are rendered to show bubble reference.
<codeprint> tags are printed to corresponding <pre> tags, only when the tags exist in the document.
Current styles (dark/bright mode, font-family, font-size, line-height) are shown.
disqus.js with id="disqus-js" is loaded.
kakao.js with id="kakao-js-sdk" is loaded.
New ShortKeys (T: Table of Contents, F: Forward Section, D: Previous Section, L: To 전체목록/[Lists]) are set.
m.delayPad=0;
m.wait=512;
wait 751ms.
<eq> and <eqq> tags are rendered to MathJax format, being enclosed by \ ( \ ) and \ [ \ ].
docuK1 scripts started!
If this log is not closed automatically, there must be an error somewhere in your document or scripts.
Table of Contents is filled out.
Auto numberings of sections (div.sec>h2, div.subsec>h3, div.subsubsec>h4), <eqq> tags, and <figure> tags are done.
<cite> and <refer> tags are rendered to show bubble reference.
<codeprint> tags are printed to corresponding <pre> tags, only when the tags exist in the document.
Current styles (dark/bright mode, font-family, font-size, line-height) are shown.
disqus.js with id="disqus-js" is loaded.
kakao.js with id="kakao-js-sdk" is loaded.
New ShortKeys (T: Table of Contents, F: Forward Section, D: Previous Section, L: To 전체목록/[Lists]) are set.
m.delayPad=0;
m.wait=512;
wait 751ms.
이 글이 도움이 되셨다면, 광고 클릭 한번씩만 부탁드립니다 =ㅂ=ㅋ. (If this article was helpful, please click the ad once. Thank you. ;)
Mode: Bright; Font: Noto Sans KR; font-size: 18.0px (10.0); line-height: 1.6;
width: 1280, height: 720, version: 3.1.1
dg:plink (Document Global Permanent Link): https://kipid.tistory.com/127
document.referrer: Empty
width: 1280, height: 720, version: 3.1.1
dg:plink (Document Global Permanent Link): https://kipid.tistory.com/127
document.referrer: Empty
Learning AngularJS
AngularJS 라고 JavaScript 를 확장해서 쓰는 framework 가 있다고 한다
[01]
. jQuery 랑 비슷한 놈이라고 생각해도 되는데, jQuery 가 HTML DOM (Document Object Model) 기반으로 selector 및 chainning 을 구현해 놓은 것이라면, AngularJS 는 MVC (Model–View–Controller) 기반으로 동적인 페이지 (Dynamic page) 를 쉽게 만들기 위한 목적으로 만들어진 감이 크다고 생각된다.뭐 개인적으론 당장 동적인 페이지를 필요로하지 않아서, 배울 필요성을 당장 느끼지는 못하는데... 멋진 dynamical HTML page 를 만들고 싶다면 꼭 배워둬야만 하는 framework 라 생각된다. (최근 google 의 support 로 폭발적인 성장을 하는듯한...)
ps. 그런데 잠깐 기초기능만 테스트 해봤는데, 왜 난 jQuery 가 더 편한거 같지?ㅋ 제대로 안써봐서 강점을 아직은 잘 모르겠음. 그냥
<span class="parameter-name"></span> 식으로 해서 처리해도 뭐...Table of Contents
T1.Introduction
▼ Show/Hide
뭔가 첫 느낌에는 animation 에 특화된 건줄 알았는데... 그냥 jQuery 의
on() response 를 간단하게 짤 수 있도록 도와준것 뿐인듯한 기분이?jQuery 에서 다음과 같이 작성되어야 하는 event handler 가 (뭔가 이상하게 짜놔서 개인적으로 조금 고쳤음.)
On the left side of codes is there a hiden button to toggle/switch scrollability ({max-height:some} or {max-height:none}).
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
var $greeting=$('#greeting');
$('#name').on("input", function() {
$greeting.text('안녕하세요, '+this.value+' !!!');
});
});
</script>
</head>
<body>
<input id="name" type="text"/>
<p id="greeting"></p>
</body>
</html>AngularJS 를 이용하면 다음과 같이 간단해 지는듯?
On the left side of codes is there a hiden button to toggle/switch scrollability ({max-height:some} or {max-height:none}).
<!DOCTYPE html>
<html ng-app>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular.min.js"></script>
</head>
<body>
<input type="text" ng-model="yourName"/>
<p>안녕하세요, {\{yourName}} !!!</p>
<!-- \ 빼시길... 여기있는 쌍중괄호도 AngularJS 가 처리해 버려서 code 가 이상해 지는듯. -->
</body>
</html>▲ Hide
TRRA1.References and Related Articles
▼ Show/Hide
- Ref. [01] AngularJS.org and GitHub - angular - Angular.js
- Ref. [02] w3schools - AngularJS
▲ Hide
이 글이 도움이 되셨다면, 광고 클릭 한번씩만 부탁드립니다 =ㅂ=ㅋ. (If this article was helpful, please click the ad once. Thank you. ;)
반응형
'[IT/Programming] > HTML related' 카테고리의 다른 글
| CSS3 examples (0) | 2019.03.04 |
|---|---|
| 괜찮은 에디터들 소개 및 추천 (Introducing/Recommending good code editors) (2) | 2019.03.04 |
| Delayed (Lazy) Loading in HTML by JavaScript (+jQuery) (0) | 2019.02.22 |
| Cloud Server Services (eg. Amazon Web Services) (0) | 2019.02.22 |
| HTTP Server-side Frameworks/Languages 뭘 써야할까? (0) | 2019.02.19 |
| CSS Specificity or Priority (우선순위) (1) | 2019.02.19 |
| Youtube Download (0) | 2019.02.18 |
