水果网站建设方案书,厦门外贸公司做网站,海洋生态文明建设的网站名,wordpress 顶 踩 插件* JavaScript分三个部分: ECMAScript标准:JS的基本的语法DOM:Document Object Model ---文档对象模型----操作页面的元素BOM:Browser Object Model-----浏览器对象模型---操作的是浏览器一、DOM对象 文档:把一个html文件看成是一个文档,由于万物皆对象,所以把这个文档看…* JavaScript分三个部分: ECMAScript标准:JS的基本的语法DOM:Document Object Model ---文档对象模型----操作页面的元素BOM:Browser Object Model-----浏览器对象模型---操作的是浏览器一、DOM对象 文档:把一个html文件看成是一个文档,由于万物皆对象,所以把这个文档看成是一个对象 1.1 什么是HTML DOM HTML Document Object Model文档对象模型 HTML DOM 定义了访问和操作HTML文档的标准方法 HTML DOM 把 HTML 文档呈现为带有元素、属性和文本的树结构节点树)1.2 DOM树 画dom树是为了展示文档中各个对象之间的关系用于对象的导航。 html文件看成是一个文档,那么这个文档看成是一个对象,文档中的所有的标签都可以看成是一个对象页面中的每个标签,都是一个元素(element),每个元素都可以看成是一个对象标签可以嵌套,标签中有标签,元素中有元素html页面中都有一个根标签--html--也叫根元素页面中的有一个根元素(标签--html),里面有很多的元素(有很多的标签,有很多的对象)文档:一个页面就是一个文档元素(element):页面中的所有的标签都是元素,元素可以看成是对象节点(node):页面中所有的内容都是节点:标签,属性,文本root:根1.3 事件概念 点击操作:------事件:就是一件事,有触发和响应,事件源按钮被点击,弹出对话框按钮----事件源点击----事件名字被点了---触发了弹框了---响应 1.4 初次体验 第一个版本 html代码,点击按钮弹出对话框,对话框:alert()js的代码 html代码中嵌入了js的代码,不方便后期的修改和维护 input typebutton value显示效果 onclickalert(我被点了) / 第二个版本 js代码很多,但是没有分离html和js该怎么做 scriptfunction f1() {//函数中可以写很多的代码alert(这是一个对话框);}
/script
input typebutton value显示效果 onclickf1()/ 第三个版本 开始分离html和js input typebutton value开始分离代码 idbtn /scriptfunction f2() {alert(开发分离html和js代码);}function f2() {alert(嘎嘎);}//html标签中的id属性中存储的值是唯一的,//id属性就像人的身份证号码一样,不能重复,页面中的唯一的标识//从文档中找到id值为btn的这个标签(元素)//document.getElementById(id属性的值);返回的是一个元素对象//根据id获取这个标签(元素)var btnObjdocument.getElementById(btn);//为按钮注册点击事件btnObj.onclickf2;//不加括号
/script 最终的版本代码 input typebutton value最终版 idbtn1/
script
// //根据id属性的值从整个文档中获取这个元素(标签)var btnObj1document.getElementById(btn1);//为该元素注册点击事件btnObj1.onclickfunction () {alert(哦,这真是太好了);};//根据id属性的值从整个文档中获取这个元素(标签)
//为该元素注册点击事件
document.getElementById(btn1).onclickfunction () {alert(哦,这真是太好了);
};
/script 转载于:https://www.cnblogs.com/dongye95/p/9185895.html
