元素对象深层理解

最新推荐文章于 2022-06-19 04:58:03 发布
最新推荐文章于 2022-06-19 04:58:03 发布
阅读量202 收藏
点赞数 1
分类专栏： JS路上遇到的问题 文章标签： 元素对象 js对象 深层理解 对象理解
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_44690237/article/details/102807300
版权

元素对象深层理解

首先我们贴出问题:

在这里插入图片描述

为什么橘色框中的代码不起效果呢?遇到这个问题时,常想到的是这样
在这里插入图片描述
通过一下代码

 console.dir(box); //基于dir看一个对象详情信息

可发现style属性值是一个新的对象(CSSStyleDeclaration),所以才能box.style,
box是一个对象有个style属性,而style也是一个对象,所以能够继续进行点运算.
在这里插入图片描述
在这里插入图片描述
与之前阿里的面试题a.x=a={n:2}类似.(用了老师的图来解释,我画的太丑了T-T)
在这里插入图片描述
DOM映射机制不了解的可以搜一搜,后面可能会写一篇(难说).

XG小怪
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
io流，线程和异常，集合，网络编程，面向对象，反射
02-15
它们提供了丰富的操作接口，如添加、删除、查找元素等。泛型的引入增强了集合的类型安全性，避免了类型转换错误。 面向对象编程（OOP）是Java的核心特性，包括封装、继承和多态三大原则。类是对象的蓝图，对象是...
对于Python深浅拷贝的理解
12-25
浅拷贝是对于一个对象的顶层拷贝，通俗的理解是：拷贝了引用，并没有拷贝内容 通过a=b这种方式赋值只是赋值的引用（内存地址），a和b都指向了同一个内存空间，所以他们的id（地址相同），这种就是浅拷贝 2，深拷贝...
元素对象以及节点对象
qq_42731393的博客
03-01 730
* Element：元素对象 1. 获取/创建：通过document来获取和创建 2. 方法： 1. removeAttribute()：删除属性 2. setAttribute()：设置属性 * Node：节点对象，其他5个的父对象 * 特点：所有dom对象都可以被认为是一个节点 * 方法： * CRUD dom树： * appendChild()：...
DOM 元素对象
rookie_is_me的博客
03-22 181
属性 element.attributes 返回一个元素的属性数组 element.childNodes 返回元素的一个子节点的数组 element.children 返回元素的子元素的集合 element.classList 返回元素的类名，作为 DOMTokenList 对象。 element.className 设置或返回元素的class属性 ...
元素对象的获取
qq_42731393的博客
03-01 176
核心DOM模型： * Document：文档对象 1. 创建(获取)：在html dom模型中可以使用window对象来获取 1. window.document 2. document 2. 方法： 1. 获取Element对象： 1. getElementById() ： 根据id属性值获取元素对象。id属性值一般唯一 2. getElementsByTagName()：根据元素名称获取元素...
JavaScriptAPI编程_Element对象（元素对象）
热门推荐
JiuMeilove的博客
06-19 2万+
当网页加载时，浏览器就会自动创建当前页面的文档对象模型（DOM），并将文档的所有部分（例如元素、属性、文本等）组织成一个逻辑树结构（类似于族谱），逻辑树的每一个分支的终点称为一个节点，每个节点都包含一个对象使用 Document 对象中提供的方法（例如 getElementsByTagName()、getElementById()、getElementsByClassName() 等）可以得到 Element 对象，在 Element 对象中同样也提供了一系列方法和属性，来操作文档中的元素或者元素中的属性。
十四、元素对象的深层理解
一个孤独漫步者的遐想的博客
05-06 231
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>扩展思考</title> <style> #box{ box-sizing:border-box; width:200px; height:200px; border:3px solid lightblue; } </.
vue data对象重新赋值无效(未更改)的解决方式
10-15
这样，即使在`data`对象内部的深层属性，Vue也能正确地追踪到变化，并更新视图。 另外，对于数组，Vue也有一套类似的规则。它不能检测到通过索引直接设置数组元素或修改数组长度的情况。为确保数组的响应性，可以...
Java面向对象（基础）- 属性赋值过程、JavaBean和UML类图
最新发布
10-24
【Java面向对象基础】属性赋值过程、JavaBean与UML类图 一、属性赋值过程 ...同时，讲解了JavaBean的基本概念和UML类图的构成，这些都是Java面向对象编程中的基础知识，对于理解和编写高质量的Java程序至关重要。
JavaScript深入理解
03-24
要理解JavaScript，你得首先放下对象和类的概念，回到数据和代码的本原。前面说过，编程世界只有数据和代码两种基本元素，而这两种元素又有着纠缠不清的关系。JavaScript就是把数据和代码都简化到最原始的程度。
DOM（文档对象模型）
mengfanshaoxia的博客
02-15 2343
1、DOM是什么 DOM（Document Object Model，文档对象模型），是用来呈现以及与任意 HTML 或 XML文档 交互的API（Application Program Interface，应用程序接口）。DOM 是载入到浏览器中的文档 模型，以节点树的形式来表现文档，每个节点代表文档的构成部分（例如：页面元素、字符串或 注释等等）。 DOM 是万维网上使用最为广泛的 API 之一，它允许运行在浏览器中的代码访问文件中的节点并 与之交互。节点可以被创建，移动或修改
节点对象和元素对象的区别？
程宇寒
02-02 936
https://cloud.tencent.com/developer/ask/32654 节点类和元素类在继承的原型中是相关的 <div id="test"> <p class="para"> 123 </p> <p class="para"> abc </p> </div&g...
JavaScript(JS)的DOM对象(JS的Document对象)----什么是DOM对象?
No8g攻城狮的博客
04-02 6914
1、概念： Document Object Model 文档对象模型：将标记语言文档的各个组成部分，封装为对象。可以使用这些对象，对标记语言文档进行CRUD（增删改查）的动态操作。 通过 HTML DOM（如图所示），可访问 JavaScript HTML 文档的所有元素。 当网页被加载时，浏览器会创建页面的文档对象模型（Document Object Model）。HTML DOM 模型被...
JavaScript笔记之元素对象操作的常用方法/属性
萌新码农的博客
07-20 684
JavaScript元素对象操作的常用方法/属性document.createElement("")创建元素document.createTextNode()创建文本appendChild()添加元素insertBefore()插入元素replaceChild()替换元素removeChild()parentNodeinnerHTMLinnerHTMLinnerText区别完整代码测试 docum...
js-元素对象 Element对象一
zhulin0519的博客
11-13 1385
要操作element对象，首先要获取到element 使用document对象里面相应的方法获取。 方法： 获取属性里面的值 getAttribute（“”）； 设置属性的值 setAttribute（“”，“”）； 删除属性值 removeAttribute（“”）；<body> <input type="text" class="a" name="input1" id="inpu
DOM元素对象，属性，方法
qq_42238554的博客
02-27 1247
addEventListener() 向指定元素添加事件句柄。 提示： 使用 removeEventListener() 方法来移除 addEventListener() 方法添加的事件句柄 语法： element.addEventListener(event, function, useCapture) 参数说明： event 必须。字符串，指定事件名。 注意: 不要使用 “on” 前缀。 例如...
教你如何写框架------元素管理篇
weixin_30673611的博客
12-03 306
前言： 我的博客从来都是言简意赅，直接步入正题。 元素对象管理： 元素对象（以下称为locator）的维护与管理很麻烦，因为locator比较多，每个页面上要操作的可能有几十个，如何快速的查找及维护好能够使我们写脚本的速度及维护速度大大提升。在前端开发中，开发人员通常是把UI样式放在CSS文件中，受此影响，我们也可以把我们的locator放在一个专门的文件中，按照页面来分类，提取其公共的lo...
HTML DOM 快速导览 – 元素对象 《img》 (HTMLImageElement)
裂缝中的阳光、的博客
11-24 5680
为 HTML 文件的内嵌元素 (embedded content) ， DOM 接口为 HTMLImageElement 。 取得 的元素对象 (object) 后，可存取元素的全局属性 (global attribute) 。 HTMLImageElement 另有定义属性 altsrccrossOriginuseMapisMapwidthheightnaturalWidthnat
DOM快速入门——DOM获取元素对象的6种方式
Potry Code的博客
08-02 1万+
目录：一、为什么要获取页面元素？二、获取元素的5种方式：1.根据id获取元素2.根据标签名获取元素3.根据name获取元素4.根据类名获取元素5.根据选择器获取元素三、总结： 一、为什么要获取页面元素？ 例如：我们想要操作页面上的某部分(显示/隐藏，动画)，需要先获取到该部分对应的元素，才进行后续操作。 二、获取元素的5种方式： 1.根据id获取元素 document.getElementById...
js 数组对象深层查找
04-28
要深层查找 JavaScript 数组对象中的元素，可以使用递归函数。以下是一个例子： ```javascript function deepFind(obj, key, value) { if (obj instanceof Array) { for (var i in obj) { var item = obj[i]; ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值