学习JS第四天

简介: 学习JS第四天

跟着黑马视频学JS第四天


DOM


获取元素



1、document.getElementById('id')//获取带ID的元素对象 返回值是一个element对象
2、document.getElementsByTagName('标签名')//获取标签对象 返回的是元素对象的集合 以伪数组的形式存储
如果页面中没有这个元素 会返回一个空的伪数组
获取父元素内部是指定标签名的子元素时,element.getElementsByTagName('标签名');
父元素必须是单个对象
例:var ol = document.getElementsByTagName('ol');
    console.log(ol[0].getElementsByTagName('li'));//注意是ol[0]而不是ol 因为这里ol是一个伪数组
    也可以通过ID选择器直接选取:
    var ol = document.getElementById('ol');
     console.log(ol.getElementsByTagName('li'));//这里的ol是单个对象
3、document.getElementsByClassName('类名')//H5新增 返回对象集合
4、document.querySelector('选择器')//H5新增 根据指定选择器返回第一个元素对象 选择器需要加符号 .class #id
5、document.querySelectorAll('选择器')//H5新增 返回指定选择器的所有元素对象集合
6、获取body元素:document.body;
7、获取html元素:document.documentElement;
8、element.getAttribute('属性');//主要用于获取自定义属性
9、element.setAttribute('属性','值');//修改自定义属性
10、element.removeAttribute('属性');//移除自定义属性
11、H5规定自定义属性以data-开头作为属性名并赋值


事件


事件三要素:事件源、事件类型、事件处理程序
改变元素内容:
    element.innerText//不识别HTML标签 不用
    element.inneerHTML//识别HTML标签 保留空格和换行
样式属性操作:element.style:fontSize //驼峰命名法 行内样式表
element.className//类名样式操作 适用于样式修改较多 会覆盖原先的类名


显示/隐藏密码案例


1687263999018.png


排他思想


1687263990863.png


视频很多案例 看了一遍 不一一记录了


相关文章
|
1月前
|
JavaScript
ES6学习(9)js中的new实现
ES6学习(9)js中的new实现
|
6天前
|
算法 JavaScript 前端开发
第一个算法项目 | JS实现并查集迷宫算法Demo学习
本文是关于使用JavaScript实现并查集迷宫算法的中国象棋demo的学习记录,包括项目运行方法、知识点梳理、代码赏析以及相关CSS样式表文件的介绍。
第一个算法项目 | JS实现并查集迷宫算法Demo学习
|
7天前
|
JavaScript 前端开发 API
紧跟月影大佬的步伐,一起来学习如何写好JS(上)
该文章跟随月影老师的指导,探讨了编写优质JavaScript代码的三大原则:各司其职、组件封装与过程抽象,通过具体示例讲解了如何在实际开发中应用这些原则以提高代码质量和可维护性。
紧跟月影大佬的步伐,一起来学习如何写好JS(上)
|
6天前
|
JavaScript 前端开发 Oracle
软件工程师,学习下JavaScript ES6新特性吧
软件工程师,学习下JavaScript ES6新特性吧
25 9
|
7天前
|
JavaScript 前端开发 算法
紧跟月影大佬的步伐,一起来学习如何写好JS(下)
该文章延续了上篇的内容,进一步探讨了编写优秀JavaScript代码的实践,强调了代码风格一致性、性能优化、团队约定的重要性,并通过实际案例分析了如何在不同场景下写出合适的代码。
|
2月前
|
JSON 前端开发 JavaScript
|
22天前
|
存储 JSON JavaScript
学习node.js十三,文件的上传于下载
学习node.js十三,文件的上传于下载
|
2月前
|
JavaScript 前端开发 iOS开发
学习强大的JavaScript一行代码,能够节省你的时间和代码量
这段内容介绍了25个实用的JavaScript一行代码技巧,涵盖复制内容到剪贴板、打乱数组、颜色值转换、计算平均值、检查数字奇偶性、数组去重、对象为空检测、字符串反转、日期计算、首字母大写、生成随机字符串、四舍五入、清除Cookie、检测暗黑模式等,帮助开发者提高效率并简化代码。
26 2
|
2月前
|
JavaScript 前端开发 小程序
基于js开发快速学习鸿蒙基础
【8月更文挑战第26天】
39 1
|
2月前
|
编解码 JavaScript 前端开发
JS逆向浏览器脱环境专题:事件学习和编写、DOM和BOM结构、指纹验证排查、代理自吐环境通杀环境检测、脱环境框架、脱环境插件解决
JS逆向浏览器脱环境专题:事件学习和编写、DOM和BOM结构、指纹验证排查、代理自吐环境通杀环境检测、脱环境框架、脱环境插件解决
58 1