在修改元素内容之前打印元素为何打印到的数据是修改后的？

最新推荐文章于 2023-02-03 16:08:50 发布

碎碎。

最新推荐文章于 2023-02-03 16:08:50 发布

阅读量1k

点赞数

分类专栏：项目中遇到的问题

本文链接：https://blog.csdn.net/weixin_43410419/article/details/103168491

版权

本文探讨了为何在修改元素内容后，通过console.log()打印元素时显示已修改的内容，而打印innerHTML属性则得到原始值的问题。关键在于浏览器的渲染机制和JavaScript中引用类型与基本类型的赋值差异。在修改元素的innerHTML后，直接打印元素会反映出更新后的状态，而打印innerHTML属性则返回修改前的字符串值。

摘要由CSDN通过智能技术生成

代码

<div>1</div>
    <script>
         var a = document.querySelector('div')
         console.log(a)    
         console.log

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

碎碎。

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

为什么console.log在修改二维数组之前就输出修改后的值？

xChive的博客

10-29

1445

本文讲解JavaScript中修改数组中的数据与console.log问题。背景今天写DP，console.log 打印二维数组，发现无论是修改前打印还是修改后打印都是一样的。 arr = [[1,2,3,4,5],[6,7,8,9,10],[11,12,13,14,15],[16,17,18,19,20]]; console.log(arr); arr[0][0] = 999; arr[1][1] = 999; arr[2][2] = 999; arr[3][4] = 999; console.log

console.log打印对象有误

m0_48334955的博客

07-31

202

console.log() 中打印的引用数据类型时，在引用数据发生改变后，其打印的值也会被修改。1、将变量序列化JSON.stringify()为字符串后输出。2、使用debugger查看变量值。3、注释下方操作变量方法。

参与评论您还未登录，请先登录后发表或查看评论

控制台输出的值在打印之后发生变化

m0_50871362的博客

04-20

661

var a = { index: 1 }; // 然后 console.log( a ); // 再然后 a.index++; 第一次不打断点直接输出的情况下输出展开变成index2 第二次我们打个断点，在输出值更改之前，让值先打印出来结果打印出来展开值为1 控制台输出如果是在程序执行完之后查看打印结果，就会造成这种输出数值已经更改的问题 ...

js 控制台打印对象，对象点开后里面属性没值，展开后有值（object展开和收起值不一致）

从事前端，不断积累经验，学习新的技术。头像不是本人是莉莉崽（美貌、可爱集于一身的小姐姐，小仙女），一个宝藏博主，值得喜欢！

10-08

5867

js 打印这个对象的语句执行的时候, 对象里面的确是有值的,但是当程序继续执行,下面的代码有对这个对象赋值的语句,所以chrome控制台显示,里面有值。打印时内存里的值已经变了，导致展开和收起不一致。因为 js对象赋值只是引用地址赋值过去了，还是指向同一个地址。所以 js想要拷贝一个 object需要深拷贝最简单的就是 json.stringfly方法示例： let obj={ name:"555", age:"15" }; console.log(ob

对于vue数组内容修改不同步的问题

花开富贵的博客

03-01

1356

今天遇到了一个问题,就是我在定义好的数组里边,修改某个对象的内容,结果不同步在我修改之后,打印了数组,明明已经是更新状态了,为什么页面视图不同步呢答案全部在这里↓↓↓ 列表渲染在vue官方文档里,明确数组更新检测规则: 我们只有使用以上函数才会触发视图的更新,同时官方也给出了相应的解释解决方案: 还有一些可能出现的问题,全部都可以在官方文档上找到答案… ...

JavaScript obj被赋值后值变化问题

SharkMarine的专栏

05-23

596

在搞Js的时候发现一个问题，就是内存中保存的数据不对！！简单举个例子吧，如下： // 定义一个person对象 var person = { info: { name: "test" } }; var b = person.info; // b被赋值为person的info值 console.log(b); // person.info = {};//如果不想让b的值变化，可以这么...

js 引用数据类型赋值时没有深拷贝后console.log出现的问题（对象中的对象赋值给一个变量）

PrimaryColor

02-27

373

示例： let obj={ age:1, head:{ width:100 } }; console.log("obj赋值前的width：",obj); let info=obj.head; info.width=30; console.log("obj赋值后的width：",obj); 以上代码，我们会以为obj的第一次打印，width为100，而obj的第二次打印，width为30。而结果却是：如果直接打印对象的具体属性，那么结果就是正确的： l

Java封装数组实现在数组中查询元素和修改元素操作示例

08-24

Java 封装数组实现在数组中查询元素和修改元素操作示例，主要介绍了 Java 封装数组实现在数组中查询元素和修改元素操作，结合实例形式分析了 Java 针对数组元素查询、修改的封装操作实现技巧。查询元素在 Java ...

Python 修改列表中的元素方法

09-20

在Python编程语言中，列表是一种常用的数据结构，用于存储有序的元素集合，这些元素可以是任何类型，包括数字、字符串甚至是其他列表。列表是可变的，这意味着我们可以修改列表中的元素，添加或删除元素，而不会改变...

在Vue中使用ref获取dom元素节点及组件内的数据和方法

01-20

通过`this.$refs.mytitle`和`this.$refs.mycontent`，我们分别获取到了对应的DOM元素，并可以进行进一步的操作，如读取其内容、修改样式、绑定事件等。 ### 二、获取组件内的数据和方法对于Vue组件，`ref`的使用...

数据结构试卷（一） 1.栈和队列的共同特点是( )。 A.只允许在端点处插入和删除元素

03-15

数据结构是计算机科学中的核心概念，它涉及到如何高效地组织和管理数据，以便于执行各种操作。本题目的重点在于栈和队列这两种基本的数据结构。 1. 栈和队列的共同特点：栈（Stack）和队列（Queue）都是线性数据...

js赋值改变后原来的东西也改变了,导致获取不到原来的数据

m0_37935175的博客

02-19

1546

js赋值改变后原来的东西也改变了,导致获取不到原来的数据【原因】：数组赋值目测在php/js这两种语言中的赋值都是应用传递(所谓引用传递就是所谓的赋值其就是共享同一个地址)，一般的字串整型等数据类型都是值传递所以不存在这类情况【解决方法】：在进行数组间赋值时，将原来的赋值方式换以下即可，代码如下 //例如 //自定义一个空数组来进行赋值 var result={4,4,5}; var dat...

ie9 输入框清空以后重新输入，获取的还是之前的值

xzx66666的博客

08-18

529

Input 输入框在ie9遇到了一系列的问题，如：页面的根据搜索条件搜索数据，清空以后重新输入，获取的还是之前的值； elementUI 的表单验证，在一次失去焦点后无法再次触发；后来发现是ie9没有支持v-model 双向绑定的功能；需要在失焦后重新赋值 <el-input placeholder="请输入内容" prefix-icon="el-icon-search" clearable v-model="filters.name" @blur="filter...

const的用法，特别是用在函数前面与后面的区别！

数据库天地

08-01

533

console.log()打印的数据和展开数据不同

a812901456的博客

12-19

1160

console.log()打印的数据和展开数据不同

Vue中数据改变但未渲染的问题，页面中并没有自动更新，但是在控制台可以打印出来，常见解决方法

liumimi973的博客

02-03

8885

打印出来值，赋值未渲染

Vuex报错之 [vuex] unknown mutation type: handlePower