基础-JavaScript

标签：

JavaScript

　发明人　　Brendan Eich　　布兰登·艾奇

　　　　　 后来，JavaScript兼容了ECMAScript标准,最新标准是ECMAScript6

作用:  　　

　　控制 "结构" 和 "样式"

使用

　　PC端　　移动端WebApp

　　Ajax异步交互技术的实现

　　逻辑的实现

特点

　　弱变量类型语言，由数据来决定数据类型，用var声明所有变量

　　解释型的脚本语言，运行前不需要编译，遇到错误就停止运行

　　程序员不需要管理内存

学习模块

　　基础核心　　基础语法

　　DOM　　　HTML中的元素的控制　　Document Object Model

　　BOM　　　浏览器的控制　　　　　　Browser Object Model

前台语言

　　作用在用户的电脑上

语法

　　对换行 空格 缩进不敏感

　　每一行以分号结尾，方便压缩

<!-- JavaScript -->
<script type="text/javascript" src="JavaScript/index.js"></script>

window里的内置对象

警告框 - win dow.alert　　

window.onload = function () {
    /*弹出警告框*/
    window.alert("人要是没有梦想,那跟咸鱼有什么分别 ");
}

文档打印 - window.document.write

window.onload = function () {
    /*文档打印输出*/
    window.document.write("人要是没有梦想,那跟咸鱼有什么分别 ");
}

console内置对象

window.onload = function () {
    /*控制台打印输出*/
    console.log("人要是没有梦想,那跟咸鱼有什么分别 ");
    /*控制台警示*/
    console.warn("2016-07-06 23：30 下班");
    /*控制台报错*/
    console.error("2016-07-06 23:29 脑抽了,待解决Bug");
}

JS的简单使用

<div id="kQueen" class="kQueen"></div>

.kQueen {
    width: 200px;
    height: 200px;
    ">red;
}

/*加载完DOM再调用*/
window.onload = function () {
    /*kQueenDiv*/
    var kQueenDiv = window.document.getElementById("kQueen");】
    kQueenDiv.style.backgroundColor = "pink";
}

变量

 JavaScript是弱类型的脚本语言

 变量的声明和初始化　
 　　var kPigNumber = 3,kPigName = "HuaHua";
 
变量的命名规则：
　　由 字母 数字 下划线 $符号 组成
　　不能以数字开头
　　区分大小写
　　长度不能超过255字符
　　不可以使用关键字和保留符号
　　
变量的作用域
　　全局变量　　全局有效
　　　　　　　　有var的，在函数最外层
　　　　　　　　没有var的，在函数内直接使用（隐式的全局变量）
　　局部变量　　局部有效
　　　　　　　　只能有var，在函数内

事件三要素
　　事件源　　　　　　触发事件的对象　　　　事件发起者
　　事件　　　　　　　触发事件的条件　　　　发起者被怎样触发
　　事件处理函数 　　 事件的响应函数　　　　具体触发什么
　　
　　onclick　　　　鼠标单击
　　onmouseover　 鼠标遮盖
　  onmouseout　　鼠标离开

<div id="kQueen" class="kQueen"></div>

<button id="kSolo">Solo</button>

.kQueen {
    width: 200px;
    height: 200px;
　　">red;
}

/*加载完DOM再调用*/
window.onload = function () {
    /*kQueenDiv*/
    var kQueenDiv = window.document.getElementById("kQueen");】
/*kSoloButton*/
　　var kSoloButton = window.document.getElementById("kSolo");
　　kSoloButton.onclick = function () {
   　　 kQueenDiv.style.backgroundColor = "pink";
　　}
}

超链接

<a href="javascript:;" id="kPapi">触发</a>

window.onload = function () {
    /*kPapiA*/
    var kPapiA = window.document.getElementById("kPapi");
    kPapiA.onclick = function () {
    }
}

练习题

输入任意数得出其 个位 十位 百位 之和

window.onload = function () {
    var x = prompt("请输入字符串:");
    var xFloat = parseFloat(x);
    var ge = xFloat%10-xFloat%1;
    var shi = xFloat/10%10-xFloat/10%1;
    var bai = xFloat/100%10-xFloat/100%1;
    console.log(ge+shi+bai);
}

隐藏div的方法
　　display;none;　　　　会清除大小，不占位置了
　　visibility:hidden;　不会清除，占位置

显示div的方法
　　display;block;　　　　
　　visibility:visible;　

基础-JavaScript

标签：

原文地址：http://www.cnblogs.com/WeWeZhang/p/5699346.html