问答博客资讯标签用户活动
logo极客观点logo项目管理logoHarmonyOS
javascript
前端
python
node.js
react
vue.js
php
laravel
go
人工智能
mysql
linux
ios
java
android
css
typescript
spring
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

innerHTML无法显示全部结果？

头像
luofeiyu
    1.6k29347707
    头像
    ShirleyYD
    3701542

    一段简单的代码

    <div id="content">
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>行号</title>
</head>
<body>
    <p>测试页面</p>
</body>
</html>
</div>

    我想用js提取出div里的html

    <script charset="utf-8" type="text/javascript" >
    var ob = document.getElementById("content");
    console.log(ob.innerHTML);
</script>

    console里面得到的结果是

        <meta charset="UTF-8">
    <title>行号</title>


    <p>测试页面</p>

    如何得到div里面完整的html呢？

    <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>行号</title>
</head>
<body>
    <p>测试页面</p>
</body>
</html>
    javascripthtml
    阅读 2.3k
    3 个回答
    得票最新
    头像
    唯一丶
      23.2k103743

      因为你这里第一段的内容会被浏览器渲染，innerHTML 获取到的是浏览器渲染后的内容，但是因为你这里又包含了一些有特殊意义的标签，所以在实际渲染后，并不是你原本写的内容了。

      如果你想要获取原始的内容，可以使用一些不会影响到的标签去放这些内容，比如把 script 标签的 type 设置为 text/html

      - <div id="content">
+ <script id="content" type="text/html">
  <!DOCTYPE html>
  <html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>行号</title>
  </head>
  <body>
  <p>测试页面</p>
  </body>
  </html>
+ </script>
- </div>

      现在，你不论是使用 innerHTML 还是 innerText 都可以获取到了。

      头像
      MrBigShot
        4.8k1688119

        可以直接提取出 html 标签中的内容然后自己拼接下外部的 html 标签么

        const ob = document.getElementsByTagName('html')[0].innerHtml
const content = `<html>${ob}</html>`
        头像
        木易
          197514

          页面渲染解析后的元素根本不存在内部html，解析过程中已经把html过滤掉了，如果要加只能你手动加了，应为在div的dom内根本没有html标签这元素image.png

          撰写回答
          你尚未登录，登录后可以
          • 和开发者交流问题的细节
          • 关注并接收问题和回答的更新提醒
          • 参与内容的编辑和改进，让解决方法与时俱进
          推荐问题