1修改节点属性和修改元素文本(setAttribute)

游鹄君2025年5月1日小于 1 分钟

示例代码

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style type="text/css">
  #dvs{width:200px;height:200px;background:blue;}
 
  .cur{border:solid 2px green;width:300px;}
 
  </style>
</head>
<body>
  <div id='dvs'><a href=""><span>军事</span></a></div>
 
  <img src="./baby.jpg" alt="" id='imgs'>
 
  <script type="text/javascript">
  var dvs = document.getElementById('dvs');
 
  var imgs = document.getElementById('imgs');
 
  dvs.addEventListener('click', function(){
 
    // this.setAttribute('class','cur');
    // this.setAttribute('name','www');
 
    // console.log(imgs.getAttribute('src'));
 
    // imgs.removeAttribute('src');
 
    //添加类名
    this.className = 'cur';
  })
 
  //设置和获取文本
  // dvs.innerHTML = '美女';
  // dvs.innerHTML = '<option>美女</option>';
 
  // textContent
  // dvs.textContent = '美女';
  // dvs.textContent = '<a href="">美女</a>';
 
/*
  console.log(dvs.innerHTML); //这个获取的是a链接
 
  console.log(dvs.textContent); //这个获取的是文本
*/
 
 
 
 
  </script>
</body>
</html>