前端学习
关注
分享
扫一扫
文章平均质量分 65
Morbidmuse
这个作者很懒，什么都没留下…
展开
-
JavaScript DOM操作之:事件进阶及对象
事件监听器 事件处理器: 通过操作HTML属性来给元素添加事件 这种方式的缺陷:不能对同一个元素多次添加相同的事件 要移除事件处理器的事件可以通过obj.事件名=null实现 事件监听器: 1.绑定事件 使用addEventListener()为一个元素添加事件 语法: obj.addEventListener(type,fn,false) type->字符串,指的是事件类型,如click,此处不加on fn->函数名,或者一个匿名函数 f原创 2021-12-24 13:32:10 · 542 阅读 · 0 评论 -
JavaScript DOM操作:事件基础
事件: 事件的主角 动作指向的对象,如元素,按钮等 事件的类型 点击,移动,指向等 事件过程 完成了什么动作JS常见事件: 鼠标事件 onclick :点击 不只是按钮,任何元素都可以添加点击事件 onmouseover: 移入 onmouseout : 移出 如:二级菜单的实现 onmousedown : 按下 onmouseup :松开 鼠标按下和松开一瞬间触发的事件 onmousemove :移动 键盘事件 onkeydown..原创 2021-12-23 15:04:26 · 804 阅读 · 0 评论 -
JavaScript DOM操作之:DOM遍历
DOM遍历: 即查找元素 如果你通过getElementById找到一个元素, 然后又想得到该元素的父元素,子元素,兄弟元素.则需要用到DOM遍历 查找父元素 obj.parentNode:获取当前元素的父元素 查找子元素 childNodes\firstChild\lastChild 获取所有的子节点,包括元素节点和文本节点 children\firstElementChild\lastElementChild 只获取元素节点 如果要获取任意一个子节点可以使用ch.原创 2021-12-23 10:44:55 · 1538 阅读 · 0 评论 -
JavaScript 基础知识
/*第一章:JavaScript简介JavaScript简介: 一种嵌入到HTML中的编程语言,或称为脚本语言,由浏览器边解释边执行,所以它是一种解释性语言 作用是控制网页的行为. 因为有了JS,使得用户可以和页面进行交互(如鼠标操作)JS的引入方式: 在HTML中引入js一般有三种方式: 外部JS 把html文件和js文件分开放在不同的文件夹中,在html文档中通过<script>标签来引用 这是最常用的引入方式,有利于提升网站性能和可维护性 既可以在he.原创 2021-12-21 16:02:01 · 572 阅读 · 0 评论 -
JavaScript DOM操作之:CSS属性操作基础
CSS属性操作: 指的是通过JavaScript来操作一个元素的CSS样式 获取CSS属性值 getComputedStyle(obj).attr / getComputedStyle(obj)['attr'] 两种写法一样 attr表示css属性名,但必须写成驼峰型,如font-size应该写成fontSize,因为'-'不是有效的js标识符 设置CSS属性值 style对象 在元素的style属性中添加样式,这种方式设置的是行内样式 obj.style.attr=.原创 2021-12-21 15:45:45 · 1003 阅读 · 0 评论 -
JavaScript DOM操作之:元素属性基础
HTML属性操作 使用javascript来操作一个元素的HTML属性 两种方式: 对象属性 对象方法 两种结果: 获取HTML属性 设置HTML属性 获取属性值 obj.attr 设置HTML属性值 obj.attr = "值" 属性操作(对象方法): getAttribute() 获取某个属性的值 // obj.getAttribute("attr") 其中attr参数必须用引号引起来 等价于obj.attr 既可以获取静.原创 2021-12-19 12:59:47 · 604 阅读 · 0 评论 -
JavaScript DOM操作基础
/*DOM(Document Object Model):文档对象模型 它是由W3C定义的一个标准 可以简单理解为对HTML中的元素进行操作的方法 我们在操作元素时,其实就是把元素看作一个对象 然后使用对象的属性和方法来进行相关操作DOM结构: html head title meta link style script ...原创 2021-12-11 17:15:16 · 780 阅读 · 0 评论 -
CSS基础3
1.盒子模型在css的盒模型中,页面上的所有元素都可以看成一个盒子盒模型的结构盒子模型由四个属性构成, content内容 padding内边距内容到边框之间的距离 margin外边距当前元素和其他元素之间的 border边框此外盒子还有两个辅助属性:width和heightcontent属性是必备属性,是指盒子的主要信息内容,其他三个部分都是可选的 内容区有三个属性:width...原创 2021-11-30 18:01:27 · 115 阅读 · 0 评论 -
CSS基础2
1.边框样式几乎所有的元素都可以定义边框,div,span,img,table.边框属性样式属性 说明 border-width 宽度 border-style 外观 border-color 颜色 定义一个边框,必须同时设置这三个属性.整体样式border-width的取值为像素值,border-style的取值 none:无 dashed:...原创 2021-11-30 15:37:59 · 175 阅读 · 0 评论 -
CSS基础1
CSS(Cascading Style Sheet)层叠样式表:用来控制网页显示效果的一种技术HTML:控制网页的结构 CSS:控制网页的外观 JavaScript:控制网页的行为CSS和CSS3CSS3是在CSS2上增加了新的内容1.CSS的引入方式: 外部样式表 是最理想的引入方式,把html文件和css文件单独放置,然后在html中使用link标签引入 语法: <...原创 2021-11-29 17:57:58 · 165 阅读 · 0 评论 -
HTML基础2
1.表单表单标签共有5种:form、input、textarea、select、option1.1 form标签简单示例<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>form标签</title> </head> <body> <!-- 1.form语法 --><!-- <fo原创 2021-11-23 16:12:16 · 364 阅读 · 0 评论 -
HTML基础
html基础原创 2021-11-23 14:10:53 · 502 阅读 · 0 评论