获取div标签特殊属性prjid：为何后续命令输出undefined？

嘿，我来帮你排查一下常见的原因，你可以逐个对照看看：

• DOM还没加载完就跑代码了
  如果你的JavaScript代码在页面的DOM元素还没渲染完成时就执行了，那目标div根本还没出现在DOM里，这时候去获取它的属性自然会得到undefined。比如你把<script>标签放在<head>里，没等<body>里的div加载就执行了代码。
  解决办法：把代码放在DOMContentLoaded事件回调里，或者直接把<script>标签放到<body>的最末尾：

  document.addEventListener('DOMContentLoaded', function() {
    const targetDiv = document.querySelector('div');
    console.log(targetDiv.getAttribute('prjid'));
  });
  

• 选择器没定位到正确的div
  先检查一下你用来获取div的选择器是不是写错了！比如用document.getElementById('wrong-id')但div的id根本不是这个，或者querySelector的语法有误，导致拿到的元素是null，再去访问null的属性就会返回undefined。
  你可以先打印一下获取到的元素，确认是不是真的找到了目标div：

  const targetDiv = document.querySelector('.your-div-class');
  console.log(targetDiv); // 如果输出null，说明选择器没找对
  

• 属性名拼写出错了
  仔细核对一下HTML里的属性是不是真的写的是prjid！有没有写成prjId、projId或者其他类似的拼写？虽然HTML属性不区分大小写，但getAttribute是严格按照你传入的字符串去匹配的，一旦拼写错了就拿不到值。

• 用错了属性获取方式
  注意，prjid是自定义属性，不是HTML标准属性，所以不能直接用div.prjid这种点语法来访问（点语法只适用于标准DOM属性，比如div.id、div.className）。
  正确的做法是用getAttribute方法：

  const targetDiv = document.querySelector('div');
  console.log(targetDiv.getAttribute('prjid')); // 正确
  

  如果是用data-*格式的自定义属性（比如<div data-prjid="123">），还可以用dataset来访问：

  console.log(targetDiv.dataset.prjid);
  

• div是动态生成的，代码执行时机不对
  如果这个div是通过AJAX请求、或者其他JavaScript代码动态添加到页面的，那你在元素生成之前执行获取属性的代码，肯定拿不到值。这时候需要确保代码在元素被添加到DOM之后再执行，或者用事件委托来监听元素的加载。

内容的提问来源于stack exchange，提问作者Jose Cabrera Zuniga