document.getElementById获取不到el-dialog弹窗里的标签元素

最新推荐文章于 2023-08-12 10:57:39 发布
置顶 最新推荐文章于 2023-08-12 10:57:39 发布
阅读量3k 收藏 9
点赞数 6
文章标签： vue javascript vue.js
原文链接：https://blog.51cto.com/9243237/2512513
版权

document.getElementById获取不到el-dialog弹窗里的标签元素


在这里插入图片描述
原因：el-dialog里的元素还没有加载完，document.getElementById获取不到标签。

解决：el-dialog加载完进行获取，放到this.$nextTick(() =>{} 里进行获取。

javascript
this.$nextTick(() => {
	var dom = document.getElementById('analysisEcharts');
	console.log(dom);
}

在这里插入图片描述
这样就可以获取到了：
在这里插入图片描述

参考：https://blog.51cto.com/9243237/2512513

EthanLiuTong
关注
  • 6
    点赞
  • 踩
  • 9
    收藏
    觉得还不错? 一键收藏
  • 4
    评论
document.getElementById为空或不是对象的解决方法
10-29
document.getElementById为空或不是对象的解决方法，一般情况下注意先内容后js.
浅谈vue中document.getElementById()拿到的是原值的问题
10-15
主要介绍了浅谈vue中document.getElementById()拿到的是原值的问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
elementui中无法获取el-dialog中的id
七月❤的博客
10-28 1688
el-dialog组件在第一次使用的时候没有问题，mounted也可以触发，但是关闭dialog后再次弹出就不再走mounted，导致可能没有办法及时获取到新的数据。 解决办法： 方法一、v-if 网上有很多人说在dialog的外层套一个div来解决，具体方式如下图 方法二、watch 我的解决办法是使用watch来进行监听。 watch: { showDialog(val) { this.initMap() } }, methods:{ initMap(){ .
Html中使用document获取元素不成功
RegSoleil的博客
06-25 1312
Html中使用document获取元素
document.getElementById获取不到标签
Rockandrollman的博客
11-12 1663
如果你是把 document.getElementById写在了内，可能会由于页面没有完全加载所以获取不到指定标签。 把 document.getElementById…写在body标签后面就可以了。 <body> </body>//写到body下面 <script type="text/javascript"> document.getElementById("qx").style.display = "none"; </script> ..
document.getElementById找不到元素
我的博客
09-11 1777
原生js document.getElementById("infonums")是空 。document.getElementById("infonums").innerText=' 您有'+data.nums+'条新通知'; 报错。 修改为jQuery方式： $('#infonums').html(' 您有'+data.nums+'条新通知');
为什么div元素没有getELementById方法？！
Tall_Cold_Q的博客
11-05 790
为什么元素没有getElementById方法；DOM结构模型
easyui dialog 标题栏 不显示
laokaizzz的专栏
04-03 4794
只是针对 类似这种的例子 http://www.jeasyui.com/demo/main/index.php?plugin=Application&theme=default&dir=ltr&pitem=  中 点击 new user时 ，这种情况下 标题栏不显示。 1.jquery版本的问题，我再 ie 11 下从 1.4  改为 1.6 就好了。 2.兼容性视图的问题，检查下
document.getElementById获取控件对象为空的解决方法
09-04
然而，有时我们可能会遇到一个问题，即在尝试使用 `document.getElementById` 获取元素时返回的是空值，即使我们确信该 ID 是存在的。这个问题通常与 JavaScript 代码的执行时机有关。 在描述的场景中，开发者试图...
TypeError document.getElementById(...) is null错误原因
09-03
`TypeError: document.getElementById(...) is null` 是一个常见的JavaScript错误，通常出现在尝试访问一个尚未加载或者不存在于DOM（文档对象模型）中的元素时。这个错误表示`document.getElementById`方法未能找到...
element ui 对话框中的元素获取
weixin_45468454的博客
05-11 2004
element ui 对话框中的元素获取 代码 <el-dialog :visible.sync="dialogVisible" width="30%" > <span class="title" id="1">选择分析对象</span> </el-dialog> <button @click='add'>点击获取对话框中的span</button>
为什么jQuery或诸如getElementById之类的DOM方法找不到元素？
p15097962069的博客
05-08 692
What are the possible reasons for document.getElementById , $("#id") or any other DOM method / jQue
关于element组件dialog无法获取里面元素的问题
abcquan123的博客
11-20 2536
关于element组件dialog无法获取里面元素的问题 直接上代码 <template> <div> <el-button @click="qqq" type="primary">111</el-button> <el-dialog title="提示" :visible.sync="dialogVisible" width="30%"> <span id="qqq">这是一段信息</span&g
获取el-dialog内元素出现Uncaught (in promise) TypeError:Cannot set properties of null (setting ‘innerHTML‘)
最新发布
m0_64284147的博客
08-12 444
根据element-ui的官方文档介绍，Dialog是懒渲染的，在第一次被打开之前都不会渲染到DOM上，如果在Dialog在未渲染的时候就进行getElementById的操作，就会报错。(2)先打开弹窗，然后使用this.$nextTick()方法把获取元素的操作套起来，即先打开，等待dialog渲染完成之后再调用getElementById获取元素。(1)可以使用文档里在open事件回调中进行元素操作。JavaScript部分。JavaScript部分。
element-ui组件dialog遇到form
weixin_30666943的博客
09-18 811
Vue.js似乎成了一种潮流。 UI框架element-ui也跟着成了一种潮流，不过得承认，至少我个人还是非常认可的，element-ui做的是真不错。 用到element-ui，那么在dialog中搭配form就必不可少。 <el-dialog :visible.sync="visible" title="弹窗" :before-close="before...
XML 用docment解析时 getElementById获取不到element的原因
weixin_44840309的博客
04-11 547
XML 用docment解析时 getElementById获取不到的原因docment解析xml docment解析xml docment解析xml时会读取dtd里面的规则，如果有 <!ATTLIST unitTest id ID #REQUIRED> 类似于这种定义，才会将元素放在对应的索引里面。通过getElementById才能获取到 ...
Vue中使用Element 第一次打开el-dialog获取不到元素的解决办法
学习 记录 总结 分享
05-10 1629
二、this.$nextTick(callback) 三、@opened opened是Dialog对话框中的事件官网描述如下：
js类名获取元素时HTMLCollection为空
keke11211的博客
09-18 2436
问题： 在vue项目中通过原生js方法获取DOM元素（类名获取元素），控制台中可以打印出来值，但是length长度为0且操作不了，代码和截图如下： console.log(document.getElementsByClassName('el-dialog__body')) 解决办法： 经分析之后，发现是因为代码写的位置不对，出现这个错误的原因是：js执行太快，获取的时候DOM元素还没有渲染完成，所以解决办法就是延迟获取，待节点渲染完成之后再获取元素： this.$nextTick...
vue 使用 el-dialog 获取元素为null的解决方法
qq_36926583的博客
07-30 2562
<el-dialog :title="(qrcodeTitle = '支付二维码')" :visible.sync="qrcodeVisible" v-if="qrcodeVisible" :before-close="closeBox" > <div slot="footer"> <div id="qrcode" style="width:200px;height:200px;margin:0 auto"></div> .
获取弹窗el-dialog
07-28
您可以通过以下步骤获取弹窗(el-dialog)： 1. 首先，您需要在页面上找到弹窗所在的元素。可以通过浏览器的开发者工具来查找，一般弹窗会使用CSS类或ID进行标识。 2. 使用JavaScript或其他前端框架的选择器来选择该元素。例如，如果弹窗使用了一个特定的CSS类名，您可以使用document.querySelector('.dialog-class')来获取该元素。如果使用了ID，可以使用document.getElementById('dialog-id')。 3. 一旦您获取到了弹窗元素，您就可以使用相应的API来控制它。例如，如果您想打开弹窗，可以使用element.style.display = 'block'来显示它；如果您想关闭弹窗，可以使用element.style.display = 'none'来隐藏它。 请注意，具体的实现方式可能会因为页面的结构和技术栈的不同而有所差异。以上是一般的步骤，您可以根据实际情况进行调整和实现。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值