2021-06-04(js周五学习内容)

一.概念

JavaScript分为三部分

ECMAScript 标准:js的基本语法,提供了核心的功能和基础

DOM: Document Object Model 文档对象模型,一个页面就是一个文档对象,可以用来操作页面的元素

BOM: Browser Object Model 浏览器对象模型(Browser浏览器的意思),用来操作浏览器的一些功能

文档  一个页面就是一个文档,编程时用文档对象document来表示html 页面的根标签,也叫根元素

元素  element,页面中所有的标签都是元素

节点  node,页面中所有的内容都是节点,包括标签,属性,文本DOM 又称文档树模型

二.getElementById

因为页面是从上往下加载的,需要将操作的标签写在对应脚本的前面

使用文档对象document调用,根据元素id查找标签的方法getElementById("id名称")

使用上一步找到标签对象,绑定其单击事件

可以直接给onclick()添加函数,但是不建议这样写,推荐将html和js分离

使用   getElementById("id名称")  方法,通过这个方法获取到对象给其添加点击事件onclick,可以使用匿名函数,注意使用有名称的函数的时候    对象.onclick = 函数名;

(注意不要加上括号,加上括号就是执行后的结果)

绑定匿名函数

给匿名函数添加点击事件绑定匿名函数

改变图片,只需要修改图片的src即可

也可以在script标签中设置图片的样式

例如

var img1 =document.getElementById("img1");

img1.style.width ="300px";

img1.style.height ="300px";

修改文本属性用innerText

document.getElementById("p2").innerText = "文本内容";

改变超链接

腾讯