JavaScript 學習筆記(二)


  • 一、常用互動方法
  • 二、常見事件響應
  • 三施无、JavaScript內置對象

一香追、常用互動方法

1-1、輸出內容
<script type="text/javascript"> 
    document.write("Hello艇拍!"); //內容用""括起來,""里的內容直接輸出。
</script>

內容可以是是變量名扫尖,也可以直接是" ",還可以是 兩者的組合

<script type="text/javascript"> 
    var mystr="boy";
    document.write("Hello盟步!" + mystr ); //內容用""括起來藏斩,""里的內容直接輸出。
</script>
1-2却盘、警告(alert 消息對話框)

也就是我們 iOS 中UIAlertController 只有一個 確定按鈕的情況:

<script type="text/javascript">
   alert("hello!");
</script>
1-3狰域、確認(confirm 消息對話框)

這個是我們 iOS 中UIAlertController 最常見的 alert 提示框,一個確認黄橘,一個取消:

confirm(str);

str:在消息對話框中要顯示的文本兆览,返回值: 是Boolean值,確定返回true, 取消返回false塞关。

 function confirmAction(){
    var mymessage = confirm("Are you Gay")       ;
    if(mymessage==true)
    {
        document.write("I am Gay");
    }
    else
    {
        document.write("I like Girl");
    }
  }    
1-4抬探、提問(prompt 消息對話框)

這個相當于 UIAlertController 中加一個 textField 一樣。

prompt(str1, str2);

str1: 要顯示在消息對話框中的文本帆赢,不可修改小压;str2:文本框中的內容,可以修改(placeholder)椰于。點擊確定返回文本框中的內容怠益,點擊取消返回 null。

function rec(){
    var score; //score變量瘾婿,用來存儲用戶輸入的成績值蜻牢。
    score = prompt("記錄分數","請輸入你的分數");                ;
    if(score>=90)
    {
       document.write("你很棒!");
    }
    else if(score>=75)
    {
       document.write("不錯吆!");
    }
    else if(score>=60)
    {
       document.write("要加油!");
    }
    else
    {
       document.write("要努力了!");
    }
}
1-5烤咧、打開新窗口(window.open)

打開另一個新窗口,直接說就是在新窗口中打開鏈接

window.open([URL], [窗口名稱], [參數字符串])
  • URL:可選參數抢呆,在窗口中要顯示網頁的網址或路徑煮嫌。如果省略這個參數,或者它的值是空字符串抱虐,那么窗口就不顯示任何文檔昌阿。
  • 窗口名稱:可選參數,被打開窗口的名稱梯码。
    1.該名稱由字母宝泵、數字和下劃線字符組成。
    2."_top"轩娶、"_blank"儿奶、"_selft"具有特殊意義的名稱。 _blank:在新窗口顯示目標網頁 _self:在當前窗口顯示目標網頁 _top:框架網頁中在上部窗口中顯示目標網頁
    3.相同 name 的窗口只能創(chuàng)建一個鳄抒,要想創(chuàng)建多個窗口則 name 不能相同闯捎。
    4.name 不能包含有空格。
  • 參數字符串:可選參數许溅,設置窗口參數瓤鼻,各參數用逗號隔開。

其實通常來說贤重,直接省略后面兩個茬祷,等于在新標簽頁中打開鏈接

window.open("http://www.baidu.com")

具體詳細可看: HTML DOM open() 方法

1-5、關閉窗口(window.close)
window.close(); //關閉本窗口
<窗口對象>.close(); //關閉指定的窗口

方法 close() 將關閉有 window 指定的頂層瀏覽器窗口并蝗。某個窗口可以通過調用 self.close() 或只調用 close() 來關閉其自身祭犯。

只有通過 JavaScript 代碼打開的窗口才能夠由 JavaScript 代碼關閉

注意: window.close()與document.close()的區(qū)別: 前者直接關閉窗口,后者文檔輸入流將被關閉滚停。

二沃粗、常見事件響應

JavaScript 創(chuàng)建動態(tài)頁面。事件是可以被 JavaScript 偵測到的行為键畴。 網頁中的每個元素都可以產生某些可以觸發(fā) JavaScript 函數或程序的事件最盅。

  • onclick // 鼠標單擊事件
  • onmouseover // 鼠標經過事件
  • onmouseout // 鼠標移開事件
  • onfocus // 光標聚焦事件
  • onblur // 失焦事件
  • onselect // 內容選中事件
  • onchange // 文本框內容改變事件
  • onload // 加載事件
  • onunload // 卸載事件

注意下面幾個:

2-1、鼠標事件 ===> UIControlEvents

好比我們常用的 UIControlEventTouchUpInside

<input name="button" type="button" value="點擊提交" onclick="action()" />
2-2起惕、onfocus onblur

第一反應 是 UITextField 中 的幾個代理事件, 但是發(fā)現 像 onclick 和 onfocus 更容易混淆

  • onclick是在對象被鼠標點擊或者選取時觸發(fā)
  • onfocus是在對象獲得焦點(“焦點”大概是接受鍵盤輸入的意思)時觸發(fā)
2-3涡贱、 unselect & onchange

針對于文本產生的事件,注意下就好

2-4惹想、onload
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title> 加載事件 </title>
<script type="text/javascript">
  function message(){
    alert("加載中盼产,請稍等…"); }
</script>    
</head>
<body onload = "message()">
  歡迎學習JavaScript。
</body>

好比系統(tǒng) 的HUD 勺馆,很讓人想用戏售。

三、**JavaScript內置對象 **

JavaScript 中的所有事物都是對象草穆,如:字符串灌灾、數值、數組悲柱、函數等锋喜,每個對象帶有屬性方法。重點記錄下下面幾個, 其他的可看 JavaScript 對象參考手冊豌鸡。

  • String
  • Array
  • Date
  • Math
3-1嘿般、String

用于處理文本(字符串)

  • 初始化
var mystr = "I love JavaScript!"
  • charAt() 方法可返回指定位置的字符。返回的字符是長度為 1 的字符串涯冠。
stringObject.charAt(index)
  • indexOf() 方法可返回某個指定的字符串值在字符串中首次出現的位置炉奴。
stringObject.indexOf(substring, startpos)
// startops 省略代表 0
  • split() 方法將字符串分割為字符串數組,并返回此數組蛇更。
stringObject.split(separator,limit)
// limit 省略 代表無限制
  • substr() 方法從字符串中提取從 startPos位置開始的指定數目的字符串瞻赶。
stringObject.substr(startPos,length)
// length 省略表示到結尾
  • substring() 方法用于提取字符串中介于兩個指定下標之間的字符。
stringObject.substring(starPos,stopPos) 
// stopPos 省略表示到結尾

其他方法參考:JavaScript String 對象

3-2派任、Array
  • 定義
var  數組名= new Array(); // 定義了一個空數組:
var 數組名 =new Array(n); // 定義時指定有n個空元素的數組:
  • concat() 方法用于連接兩個或多個數組砸逊。此方法返回一個新數組,不改變原來的數組掌逛。
arrayObject.concat(array1,array2,...,arrayN)
  • join()方法用于把數組中的所有元素放入一個字符串师逸。元素是通過指定的分隔符進行分隔的。
arrayObject.join(分隔符)
  • reverse() 方法用于顛倒數組中元素的順序豆混。
arrayObject.reverse()
  • slice() 方法可從已有的數組中返回選定的元素篓像。
arrayObject.slice(start,end)
//1. 返回一個新的數組,包含從 start 到 end (不包括該元素)的 arrayObject 中的元素崖叫。
//2. 該方法并不會修改數組遗淳,而是返回一個子數組
  • sort()方法使數組中的元素按照一定的順序排列。
arrayObject.sort(方法函數)

真心感覺這個要比 Oc中的數組強大方便啊心傀,至少省略了很多事吧屈暗!
其他方法參考:JavaScript Array 對象

3-3、Date
  • 定義
var mydate=new Date(); 
  • 設置年份
mydate.setFullYear(81); //設置年份
mydate.getFullYear()脂男; //輸出年份  

不同瀏覽器养叛, mydate.setFullYear(81)結果不同,年份被設定為 0081或81兩種情況宰翅。

  • 獲取星期
  var mydate=new Date();
  var weekday=["星期日","星期一","星期二","星期三","星期四","星期五","星期六"];
  var mynum = mydate.getDay();
  document.write("今天是:" + weekday[mynum]);
  • get/setTime()返回/設置時間
<script type="text/javascript"> 
    var mydate=new Date(); 
    document.write("當前時間:"+mydate+"<br>"); 
    mydate.setTime(mydate.getTime() + 60 * 60 * 1000); 
    document.write("推遲一小時時間:" + mediate);
</script>

其他方法參考:JavaScript Date 對象

3-4弃甥、Math

Math對象,提供對數據的數學計算汁讼。它是一個固有的對象淆攻,無需創(chuàng)建它阔墩,直接把 Math 作為對象使用就可以調用其所有屬性和方法。

  • 隨機數 random()
Math.random();

random() 方法可返回介于 0 ~ 1(大于或等于 0 但小于 1 )之間的一個隨機數瓶珊。

  • 四舍五入round()
Math.round(x)

這個一直是在OC 中希望有的

同時還有向下去整和向上取整等多種方法啸箫,看下面兩個圖:

Math 對象屬性
Math 對象方法

真的感覺很強大,其他具體方法參考:JavaScript Math 對象伞芹。

學習筆記來源: W3Schhool JS 教程上 忘苛、 慕課網

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
  • 序言:七十年代末唱较,一起剝皮案震驚了整個濱河市扎唾,隨后出現的幾起案子,更是在濱河造成了極大的恐慌南缓,老刑警劉巖胸遇,帶你破解...
    沈念sama閱讀 218,755評論 6 507
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現場離奇詭異西乖,居然都是意外死亡狐榔,警方通過查閱死者的電腦和手機,發(fā)現死者居然都...
    沈念sama閱讀 93,305評論 3 395
  • 文/潘曉璐 我一進店門获雕,熙熙樓的掌柜王于貴愁眉苦臉地迎上來薄腻,“玉大人,你說我怎么就攤上這事届案♀挚” “怎么了?”我有些...
    開封第一講書人閱讀 165,138評論 0 355
  • 文/不壞的土叔 我叫張陵楣颠,是天一觀的道長尽纽。 經常有香客問我,道長童漩,這世上最難降的妖魔是什么弄贿? 我笑而不...
    開封第一講書人閱讀 58,791評論 1 295
  • 正文 為了忘掉前任,我火速辦了婚禮矫膨,結果婚禮上差凹,老公的妹妹穿的比我還像新娘。我一直安慰自己侧馅,他們只是感情好危尿,可當我...
    茶點故事閱讀 67,794評論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著馁痴,像睡著了一般谊娇。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上罗晕,一...
    開封第一講書人閱讀 51,631評論 1 305
  • 那天济欢,我揣著相機與錄音赠堵,去河邊找鬼。 笑死法褥,一個胖子當著我的面吹牛顾腊,可吹牛的內容都是我干的。 我是一名探鬼主播挖胃,決...
    沈念sama閱讀 40,362評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼梆惯!你這毒婦竟也來了酱鸭?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 39,264評論 0 276
  • 序言:老撾萬榮一對情侶失蹤垛吗,失蹤者是張志新(化名)和其女友劉穎凹髓,沒想到半個月后,有當地人在樹林里發(fā)現了一具尸體怯屉,經...
    沈念sama閱讀 45,724評論 1 315
  • 正文 獨居荒郊野嶺守林人離奇死亡蔚舀,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 37,900評論 3 336
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現自己被綠了锨络。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片赌躺。...
    茶點故事閱讀 40,040評論 1 350
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖羡儿,靈堂內的尸體忽然破棺而出礼患,到底是詐尸還是另有隱情,我是刑警寧澤掠归,帶...
    沈念sama閱讀 35,742評論 5 346
  • 正文 年R本政府宣布缅叠,位于F島的核電站,受9級特大地震影響虏冻,放射性物質發(fā)生泄漏肤粱。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 41,364評論 3 330
  • 文/蒙蒙 一厨相、第九天 我趴在偏房一處隱蔽的房頂上張望领曼。 院中可真熱鬧,春花似錦领铐、人聲如沸悯森。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,944評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽瓢姻。三九已至,卻和暖如春音诈,著一層夾襖步出監(jiān)牢的瞬間幻碱,已是汗流浹背绎狭。 一陣腳步聲響...
    開封第一講書人閱讀 33,060評論 1 270
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留褥傍,地道東北人儡嘶。 一個月前我還...
    沈念sama閱讀 48,247評論 3 371
  • 正文 我出身青樓,卻偏偏與公主長得像恍风,于是被迫代替她去往敵國和親蹦狂。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 44,979評論 2 355

推薦閱讀更多精彩內容

  • JavaScript數據類型 在 JavaScript 中的數據類型:string(字符串)朋贬、number(數字凯楔,...
    yohn閱讀 631評論 2 0
  • 一、JS前言 (1)認識JS 也許你已經了解HTML標記(也稱為結構)锦募,知道了CSS樣式(也稱為表示)摆屯,會使用HT...
    凜0_0閱讀 2,773評論 0 8
  • 第1章 認識JS JavaScript能做什么?1.增強頁面動態(tài)效果(如:下拉菜單糠亩、圖片輪播虐骑、信息滾動等)2.實現...
    mo默22閱讀 1,294評論 0 5
  • 第5章 引用類型(返回首頁) 本章內容 使用對象 創(chuàng)建并操作數組 理解基本的JavaScript類型 使用基本類型...
    大學一百閱讀 3,237評論 0 4
  • 慈母嚼秋草, 化乳哺愛子赎线, 俯首為下代廷没, 清苦無它求。 早秋氛驮,清晨腕柜,薄霧,細雨綿綿矫废,路邊的草地上盏缤,牛媽媽帶著孩...
    虹樹閱讀 370評論 21 25