JavaScript零基础学习系列四

时间:2023-03-10 00:49:43
JavaScript零基础学习系列四

案例分享

JavaScript零基础学习系列四

对象

具体的东西,在以js的眼光看所有的标签都是标签对象,对象是属性的无序集合。

创建对象有两种方式:

直接量;

JavaScript零基础学习系列四

构造器:所谓的构造器,其实就是函数,只不过这个函数有些特殊,因为它是用于创建对象的,所以首字母大写。想借鉴类的思想。然而在js中是没有类的,所以这个构造器就充当了类的角色。

JavaScript零基础学习系列四

简单应用一

  • Js控制改变标签的html属性和Css属性之间的区别与如何获取标签对象。

    1.首先获取标签,document.getElementById('标签id值')

    2.找到对应的标签属性并赋值

      a.HTML的标签属性设置

         1.取值var w=对象.HTML属性名

         2.对象.HTML属性名=值

      b.CSS属性设置

         1.Var ab=对象.style.CSS属性名

         2.对象.style.CSS属性名=值(字符串)

    3.CSS中的属性比如:background-color应转化为:backgroundColor 此为小驼峰的命名法。

    4.注意:网页获取下来的“值”都是字符串所以在针对CSS属性的时候必须将得到的属性添加上单位px

案例分享

JavaScript零基础学习系列四

JavaScript零基础学习系列四

图二中既是对于CSS属性的修改,此时需注意的是添加单位px,以及小驼峰法转换 原来的写法如:background-color ---》backgroundColor

简单应用二

认真体会如果修改以及获取元素的值,修改网页中的文字内容是否与修改单标签中的值一致?

JavaScript零基础学习系列四

JavaScript零基础学习系列四

这里计算的仅仅是整数的简单运算所以用parseInt()将获取下来的字符全部转换成了整数进行运算。

注意:innerHTML和value对比,innerHTML所有在这个对象之内的内容都是innerHTML的内容。value内容一般是指input标签的时候是value,双标签都需要用到innerHTML,而单标签input则为value。

JavaScript零基础学习系列四

创建标签的方法与添加标签至body中或者对应obj中的方法如上。

事件

HTML和Js通过事件建立起来联系,所以在JavaScript中我们对于事件的学习尤为重要。

鼠标事件:

onclick:点击事件

onmouseover:鼠标放上

onmouseout:鼠标离开

ondbclick:双击

onmousedown: 鼠标按下

onmouseup: 鼠标抬起

onmousemove: 鼠标移动。

举个单击事件