JavaScript 學習中……
萌芽的小白筆記！入門級。讓我們一起開始學習JavaScript吧(*^▽^*)該文檔可能會多次編輯請注意！關於點擊事件語法：
$("#li").click(function () {
一定要這麼些纔行喲
});
click 單擊事件
dblclick 雙擊事件
removeClass 刪除一個類
addClass 添加一個類
$(".you").remove(); 查詢然後刪除
$("#you").show(); 顯示
$(this).hide(); 隱藏
Alert(“xxx”); 彈框
$("#mima").val();獲取文本框裏的值
$("tr").click(function () { //鼠標點擊運行
$("tr").removeClass("yanse"); //刪除一個類
$(this).addClass("yanse");}); //添加一個類
給tr設點擊事件，點擊tr（顏色）類 這裏的類不用加點。再次點擊別的tr然後刪除顏色類 $(".點擊").click(function(){ $("#zuo").slideToggle("slow");}); 點擊某個類事件，然後收回下拉框 window.location.href="https://www.baidu.com/"; 1、在原來的窗體中直接跳轉用 在新窗體中打開頁面用： window.open('你所要跳轉的頁面');常用事件方法喲=================================================== 2018-12-18 10:04:28 【編輯中】=======
jQuery篇
$('隱藏').hide(速度,callback);
$('顯示').show(速度,callback);
可選的 callback 參數是隱藏或顯示完成後所執行的函數名稱。
jQuery Fading 方法
通過 jQuery，您可以實現元素的淡入淡出效果。（selector:選擇器；speed：速度；callback：回調函數；opacity：透明度）
jQuery 擁有下面四種 fade 方法：
- fadeIn() //用於淡入已隱藏的元素。 $(selector).fadeIn(speed,callback);
- fadeOut() //方法用於淡出可見元素。 $(selector).fadeOut(speed,callback);
- fadeToggle() //可以在 fadeIn() 與 fadeOut() 方法之間進行切換。 $ 語法不變，但效果是上面兩種的合併版
- fadeTo() //允許漸變爲給定的不透明度（值介於 0 與 1 之間）。$(selector).fadeTo(speed,opacity,callback);
其實無非也就是display: none;
jQuery 滑動方法
通過 jQuery，您可以在元素上創建滑動效果。
jQuery 擁有以下滑動方法：
- slideDown() //用於向下滑動元素。 $(selector).slideDown(speed,callback);
- slideUp() //用於向上滑動元素。 $(selector).slideUp(speed,callback);
- slideToggle() //可以在 slideDown() 與 slideUp() 方法之間進行切換。 $ 語法不變，但效果是上面兩種的合併版
jQuery 動畫 - animate() 方法
jQuery animate() 方法用於創建自定義動畫。 $(selector).animate({params},speed,callback); params[參數]
====================================================2018-12-21 22:21 【編輯中】=======
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<script>
function displayDate() {
document.getElementById("demo").innerHTML=Date();
}/* 獲取文本ID並替換成Date()方法 */
</script>
<body>
<h1>我的第一個JavaScript練習!</h1>
<p id="demo">萌芽芽世界第一可愛</p>
<button onclick="displayDate()">顯示日期</button>
<!--JavaScript能夠直接插入HTML輸出流中-->
<script>
document.write("<h3>可以直接輸出的文本</h3>")
document.write(Date()+"<br>")
</script>
只可以在HTML輸出流中使用<strong>document.write</strong>.
如果您在文檔已加載後使用它(比如函數中),會<b>覆蓋整個文檔</b>!
<!--對事件的反應,點擊[onclick]彈出框[alert]喲--><br>
<button type="button" onclick="alert('Hello,World!')">開啓新世界的大門</button>
<script>
function myFunCtion() {
x=document.getElementById("demo"); //找到元素
x.innerHTML="萌芽芽世界第一帥氣"; //改變內容
}
</script>
<button onclick="myFunCtion()">改變內容</button>
<!--改變HTML圖像,這裏用到了if else判斷語句,萌芽這裏沒圖就不詳細演示了-->
<script>
function changelmage() {
myimage=document.getElementById('MyImg');
if(myimage.src.match("圖片A")){//判斷當前ID的src目錄下是否是圖片A
myimage.src="圖片B"; //是則返回圖片B
}else {
myimage.src="圖片A"; //不是則換成圖片A
}}
<!--改變HTMML樣式-->
moyako=document.getElementById("demo");//找到元素
moyako.style.color="pink"; //改變樣式
<!--驗證是否爲數字-->
function yanzheng() {
var x=document.getElementById('text').value;
if (x==''||isNaN(x)){
alert("不是數字")
}}
</script>
<input id="text" type="text">
<button onclick="yanzheng()">是否爲數字</button>
<!--JavaScript顯示數據-->
<script>
window.alert('Hello,World!'); //彈出警告框
document.write('Hello,World!');//方法將內容寫到HTML文檔中
//innerHTML('Hello,World!'); //寫入到HTML元素
console.log('Hello,World!'); //寫入到控制檯
/*關於JavaScript的變量(var)*/
var name="萌牙子",age=18,sex="女";
</script>
</body>
</html>
=================================================== 一些過去的實例練習，可以不往下繼續看 ===
獲取時間：
$(".input").click(function () {
var time = new Date(); //【獲取當前時間】 ↓ 時間
time.setTime(time.getTime()); //【time.setTime(time.getTime()+24*60*60*1000);】
var s1 = time.getFullYear()+"-" + (time.getMonth()+1) + "-" + time.getDate();
}); //【拼接，這個必須有，不然前臺後臺都看不懂】
下拉框：
$(document).ready(function(){ //找到點擊的東西 [必須有]
$(".btn1").click(function(){ //點擊這個東西
$("p").slideToggle(); //所謂的下拉框
});
var day3 = new Date();
for(var i = 0; i<7;i++){
day3.setTime(day3.getTime()+24*60*60*1000);
var s1 = day3.getFullYear()+"-" + (day3.getMonth()+1) + "-" + day3.getDate();
$("h3").eq(i).text(s1); 第幾個替換成什麼
}
點擊按鈕更換顏色：
$(".input").click(function () {
if($(this).val()=="預定"){
$(this).css("background-color","#E0847B")
$(this).val("取消"); /*按鈕點擊事件更換顏色*/
}else{
$(this).val("預定");
$(this).css("background-color","#93d0cd")
}
});
這個好用！定位噠。