JavaScript简介,JavaScript基本语法,DOM,BOM简单用法

1、JavaScript简介

JavaScript概念:是一门客户端脚本语言
运行在客户端浏览器中的。每一个浏览器都有JavaScript的解析引擎
脚本语言:不需要编译,直接就可以被浏览器解析执行了
功能:可以来增强用户和html页面的交互过程,可以来控制html元素,让页面有一些动态的效果,增强用户的体验。
JavaScript = ECMAScript + JavaScript特有的东西(BOM,DOM)

ECMAScript:客户端脚本语言的标准
1、基本语法
1、与html的结合方式
1、内部JS:定义

2、DOM简单学习

功能:控制html文档的内容
代码:获取页面标签(元素)对象 Element
document.getElementById(“id值”):通过元素的id获取元素对象
操作Element对象:
1、修改其属性值:
1、明确获取的对象是哪一个
2、查看API文档,找其中的属性
2、修改标签体内容:
属性:innerHTML

3、事件简单学习

功能:某些组件被执行了某些操作后,触发某些代码的执行。
如何绑定事件:
1.直接在html标签上,指定事件的属性(操作),属性值就是js代码
onClick-- 单击事件

4、BOM

1、概念:Browser Object Model 浏览器对象模型
将浏览器的各个组成部分封装成对象。
2、组成:
Window:窗口对象
方法:
1、与弹出框有关的方法:
alert() 显示带有一段消息和一个确认按钮的警告框。
confirm() 显示带有一段消息以及确认按钮和取消按钮的对话框。
如果用户点击确定按钮,则方法返回true,否则返回false。
prompt() 显示可提示用户输入的对话框。
2、与打开关闭有关的方法:
close() 关闭浏览器窗口。
open() 打开一个新的浏览器窗口。
3、与定时器有关的方式:
setTimeout() 在指定的毫秒数后调用函数或计算表达式。
clearTimeout() 取消由setTimeout() 方法设置的timeout。
setInterval() 按照指定的周期(以毫秒计)来调用函数或计算表达式
clearInterval() 取消由setInterval()设置的Interval
特点:
1、Window对象不需要创建可以直接使用 window使用。window.方法名() ;
2、window引用可以省略。 方法名( );
属性:
1、获取其他BOM对象
History
Location
Navigator
Screen
2、获取DOM对象
document
Navigator:浏览器对象
Screen:显示器屏幕对象
History:历史记录对象
Location:地址栏对象:
1、创建(获取)
1、window.location
2、location
2、方法
reload( ) 重新加载当前文档。刷新
3、属性
href 设置或返回完整的URL。

5、DOM

概念:Document Object Model
将标记语言文档的各个组成部分,封装成对象。可以使用这些对象,对标记语言文档进行CRUD的动态操作
Document:文档对象
1、创建(获取):在html dom模型中可以使用window对象来获取
1、window.document
2、document
2、方法
1、获取Element对象
1、getElementById( ):根据id属性值获取元素对象。属性值一般唯一
2、getElementsByTagName( ):根据元素名称获取元素对象们。返回值是一个数组。
3、getElementsByClassName( ):根据class属性值获取元素对象们。返回值是一个数组
4、getElementsByName( ):根据name属性值获取元素对象们。
2、创建其他DOM对象
createAttribute(name)
createComment()
createElement()
createTextNode()
3、属性
Element:元素对象
1、获取:通过document来获取和创建
2、方法:
1、removeAttribute():删除属性
2、setAttribute():设置属性
3、
Node:结点对象,其他对象的父对象

猜你喜欢

转载自blog.csdn.net/Gaoju12138/article/details/115287589