js相关知识

12.3 初识JavaScript
组成三部分
ECMAScript(核心)
DOM (document object model) 文档对象模型
BOM (brown object model) 浏览器对象模型
使用方式
1、行间样式

不要这样做 2、内嵌 3、外链 script标签只干一件事，要么外链，要么内嵌。同时有外链和内嵌，则内嵌失效 代码执行顺序 从上往下进行 如果不按执行顺序写代码，则需要在js代码前加window.onload = function( ) { } js语言的注释方式 单行注释：// 单行注释 多行注释：/* */ 实现交互的三要素 1、找到谁(在这个文档里，通过id获取一个元素) ps：document.getElementById('box') 2、什么操作(事件) .动作属性名 新学词汇 onclick 鼠标点击 onmouseover 鼠标划上 onmouseout 鼠标滑离 onmousedown 鼠标按下 onmouseup 鼠标抬起 声明变量 var box = document.getElementById('box'); 先声明，再赋值 var name; // 声明 name = '小王'; // 赋值 声明并赋值（一个var一个） var name = '小王'; // 字符串 var age = 3; // 数字 字符串拼接规则 1、删除被你替换的 2、写两引号（同外面的引号） 3、在引号之间写两加号 4、在加号之间写变量 一个var 声明多个 var name = '小王', age = 3, sex = '男'; 中间需要用逗号隔开，注意不能误用分号 变量声明的规则 1、只能以字母、数字、_、$ 2、不能以数字开头 3、不能使用关键字、保留字（js门语言已经使用的和未来可能使用的） 4、区分大小写 推荐使用 1、具有语义化 2、驼峰命名 3、发生什么事(函数) box.οnclick= function() { }; 获取和设置元素 表单元素的内容操作 获取：元素.value btn.onclick = function() {console.log(txt.value)} 设置(替换、改变)：元素.value = 值 btn2.onclick = function() {txt.value = '阿文很漂亮'} 闭合标签的内容操作 innerText 注意：标签会当做文本输出 获取：元素.innerText 设置：元素.innerText = 值 方式一： 获取原来的内容，再加上新的内容，再赋给box var t = box.innerText + '，你是猴子搬来的救兵吗？'; box.innerText = t 方式二： 获取原来的内容，再加上新的内容，再赋给box box.innerText = box.innerText + '，你是猴子搬来的救兵吗？' 方式三： 左右两边相加，然后赋给左边 box.innerText += '，你是猴子搬来的救兵吗？' innerHtml 注意：它识别标签 console.log(box.innerHTML); // 获取 box.innerHTML = "你是猴子搬来的救兵吗？"; // 设置 获取原来的内容，再加上新的内容，再赋给box var t = box.innerHTML + '
你是 猴子搬来的救兵吗？'; box.innerHTML = t 元素属性操作 获取 元素.属性名 console.log(box.title); // 获取 元素.属性名 = 值 box.title = '春天梅花' // 修改 设置 元素['属性名'] console.log(box['title'])// 获取 元素['属性名'] = 值 box['title'] = 'ccc'//修改 元素样式操作 元素.style.样式名 = 值 元素.style.cssText = 值; 会把原来写在行内的样式清除 样式名是font-size，要改成fontSize class的操作 获取：元素.className 设置：元素.className = 值 复合写法：元素.className += ' 值' 图片的操作 元素.src 获取，是一个绝对地址 元素.src = 值 文字放大和缩小 count = count + 2 count += 2 message.style.fontSize = count + 'px'