16
Part 1 1
| Date post: | 11-Feb-2017 |
| Category: |
Technology |
| Upload: | oum-saokosal |
| View: | 260 times |
| Download: | 1 times |
Part 1
1
Where to find more about me?Oum Saokosal, M.Sc. in Info Sys, Jeonju Univ., S. KoreaDean of Fac. Computer Science, NPIC, Cambodia•https://youtube.com/user/oumsaokosal•https://slideshare.net/oumsaokosal•https://facebook.com/kosalgeek•https://twitter.com/okosal•https://kosalgeek.com
2
HTML<html>
<head><title>Example</title></head><body>
<h1>Hello</h1><label>Enter Your name</label><input type="text" id="text1" name='txtName'><input type="button" value="ok" id="button1"><label id="name1"></label>
</body></html>
3
Document Object Model - DOM•window•document• document.title• document.body• document.scripts• document.links
4
DOM: Get Element?<label>Enter Your name</label><input type="text" id="text1" name='txtName'>
document.getElementById('text1')document.getElementsByName('txtName')document.getElementsByTagName('label')document.getElementsByClassName('main');
5
Javascript<html>
<head><title>Example</title>
<script>window.alert('');</script></head><body>
<h1>Hello</h1><label>Enter Your name</label><input type="text" id="text1" name='txtName'><input type="button" value="ok" id="button1"
onclick="alert('Hello JS')"><label id="name1"></label>
</body></html>
6
JS Languagevar a = 1; alert(typeof(a));if(a === '1'){
alert("equal value");}else if(a == '1'){
alert("equal to");}
7
JS Language=== !==== !=> >= < <=&& ||i++ ++i i-- --i+= -= *= /= %=
8
JS Languageif .. elseswitch caseforwhiledo .. while
9
JS Arrayvar a = new Array();a[0] = 3;a[1] = 5;
var b = ['Apple', 'Ball', 'Cat'];b.push('Dog');
10
JS Functionfunction okClick(){
window.alert("Hello");document.write("Here you are");document.writeln("There you go");console.log("See me in bottom");
}okClick();
11
JS: Funny about Functionvar sum = function(a, b){ //anonymous function
return a + b;}sum(5, 4);
12
JS: Self-Invoke Function<p>Below is the JS self-invoke function</p><script>(function(name){
alert("Hello " + name);})('kosal');</script>
13
JS: Event ListenerButton:<input type="button" value="ok" onclick="okClick()">
Textbox:<input type="text" onchange="textChange()" onkeypress="this.onchange()" oninput="this.onchange()"onpaste="this.onchange()">
14
JS + DOM<script>function okClick(){
var name1 = document.getElementById('name1'); name1.innerHTML = "Oum Saokosal";
name1.style.fontSize = "1.5em";}</script><input type="button" value="ok" onclick="okClick()">
<label id="name1"></label>
15
Get Options of <select><select id="s1" onchange="choose()">
<option value="1">Apple</option><option value="2">Banana</option>
</select>function choose(){
var s1 = document.getElementById('s1');var o1 = s1.options[s1.selectedIndex];alert(o1.value + ", " + o1.innerHTML);
}
16
