html head 添加子标签

zfyljx

于 2023-12-26 11:53:01 发布

阅读量367

点赞数 9

文章标签： html 前端

本文链接：https://blog.csdn.net/weixin_41334434/article/details/135218460

版权

<!DOCTYPE html>  
<html>  
<head>  
  <!-- 原有的头部内容 -->  
</head>  
<body>  
  <!-- 页面内容 -->  
  
  <script>  
    // 获取<head>标签  
    var headTag = document.getElementsByTagName('head')[0];  
  
    // 创建<meta>标签  
    var metaTag = document.createElement('meta');  
    metaTag.setAttribute('charset', 'UTF-8');  
    headTag.appendChild(metaTag);  
  
    // 创建<meta name="viewport">标签  
    var viewportTag = document.createElement('meta');  
    viewportTag.setAttribute('name', 'viewport');  
    viewportTag.setAttribute('content', 'width=device-width, initial-scale=1.0');  
    headTag.appendChild(viewportTag);  
  
    // 创建<title>标签  
    var titleTag = document.createElement('title');  
    titleTag.textContent = '标题'; // 替换为实际的标题内容  
    headTag.appendChild(titleTag);  
  </script>  
</body>  
</html>

<!DOCTYPE html>  
<html>  
<head id="headTag">  
  <!-- 原有的头部内容 -->  
</head>  
<body>  
  <!-- 页面内容 -->  
  
  <script>  
    // 获取<head>标签  
    var headTag = document.getElementById('headTag');  
  
    // 使用innerHTML创建<meta>和<title>标签  
    headTag.innerHTML = '<meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>标题</title>';  
  </script>  
</body>  
</html>