Code前端首页关于Code前端联系我们
首页 前端开发Vue正文

VueUse Head npm是什么？怎么用？

terry 1年前 (2025-05-03) 阅读数 327 #Vue
文章标签 Head

在前端开发的世界里,随着技术的不断发展和框架的日益丰富，各种工具和库层出不穷，为开发者带来了极大的便利，VueUse Head npm就是其中一个备受关注的工具，那么它究竟是什么？又该如何使用呢？下面我们就来详细了解一下。

VueUse Head npm是什么

VueUse Head npm是一个基于Vue.js的实用工具库，它主要用于管理页面的头部信息，比如标签、<meta>标签等，在Vue项目中，我们经常需要动态地设置页面的标题、描述等元数据，VueUse Head npm就为我们提供了一种简洁高效的方式来实现这一功能。</p> <p>它的出现,解决了传统方式下手动操作DOM来设置头部信息的繁琐和不便，通过VueUse Head npm，我们可以在Vue组件中以声明式的方式轻松管理页面的头部内容，使代码更加清晰、易于维护。</p> <h2>VueUse Head npm的安装</h2> <p>要使用VueUse Head npm，首先需要进行安装，在你的Vue项目目录下，打开终端，输入以下命令：</p> ```bash npm install @vueuse/head ``` <p>或者如果你使用的是yarn,命令则是：</p> ```bash yarn add @vueuse/head ``` <p>安装完成后,就可以在项目中引入并使用了。</p> <h2>VueUse Head npm的基本使用</h2> <h3>（一）在Vue组件中使用</h3> <p>在Vue组件中使用VueUse Head npm非常简单，在组件的<script>标签中引入：</p> ```javascript import { useHead } from '@vueuse/head' ``` <p>在组件的setup函数中使用：</p> ```javascript export default { setup() { useHead({ title: '我的页面标题', meta: [ { name: 'description', content: '这是一个关于VueUse Head npm的页面描述' } ] }) return {} } } ``` <p>这样,在页面渲染时，就会自动设置<title>标签为“我的页面标题”，并添加相应的 <h3>（二）动态更新头部信息</h3> <p>我们需要根据用户的操作或者数据的变化来动态更新头部信息,VueUse Head npm也支持这一点，我们有一个按钮，点击它可以改变页面标题：</p> ```html <template> <button @click="changeTitle"></button> </template> <script> import { useHead } from '@vueuse/head' import { ref } from 'vue' <p>export default { setup() { const title = ref('初始标题') useHead({ title: () => title.value })</p> <pre><code>const changeTitle = () => { title.value = '新标题' } return { changeTitle }</code></pre> </script> ``` <p>在这个例子中,我们使用了Vue的响应式数据ref，当点击按钮时，title的值发生变化，页面的标题也会随之更新。</p> <h2>VueUse Head npm的高级用法</h2> <h3>（一）多个Head实例</h3> <p>在一些复杂的项目中,可能需要多个Head实例来管理不同部分的头部信息，VueUse Head npm也支持这种情况，我们有一个主应用和一个子组件，都需要设置自己的头部信息：</p> ```javascript // 主应用 import { useHead } from '@vueuse/head' <p>useHead({ '主应用标题', meta: [ { name: 'application-name', content: '主应用' } ] })</p> <p>// 子组件 export default { setup() { useHead({ title: '子组件标题', meta: [ { name: 'component-name', content: '子组件' } ] }) return {} } }</p> <pre><code><p>这样，主应用和子组件的头部信息会合并显示，子组件的信息会覆盖主应用中相同类型的信息（比如标题）。</p> ### （二）与Vue Router结合 <p>在Vue项目中，Vue Router是常用的路由管理工具，VueUse Head npm可以很好地与Vue Router结合，根据不同的路由设置不同的头部信息。</p> ```javascript import { useHead } from '@vueuse/head' import { useRoute } from 'vue-router' export default { setup() { const route = useRoute() useHead({ title: () => { switch (route.name) { case 'home': return '首页' case 'about': return '关于我们' default: return '默认标题' } } }) return {} } }</code></pre> <p>在这个例子中,根据当前路由的名称，动态设置页面的标题。</p> <p>VueUse Head npm是一个非常实用的工具，它为Vue开发者提供了一种简洁、高效的方式来管理页面的头部信息，无论是基本的静态设置，还是动态更新、复杂场景下的多个实例以及与其他工具（如Vue Router）的结合使用，都能轻松应对，通过本文的介绍，相信你对VueUse Head npm有了更深入的了解，希望你在今后的Vue项目开发中能够充分利用它，提升开发效率，打造出更加优质的前端应用。</p> <div class="rights"> <h5>版权声明</h5> <p>本文仅代表作者观点，不代表Code前端网立场。<br>本文系作者Code前端网发表，如需转载，请注明页面地址。</p> </div> </div> <div class="Prev_Next"> <span>上一篇：<a href="https://codeqd.com/post/20250520559.html">如何在 VueUse 中使用 height 相关功能？</a></span> <span>下一篇：<a href="https://codeqd.com/post/20250520561.html">VueUse Hotkey，前端交互的魔法密钥</a></span> </div> </div> <div class="related main_list"> <div class="title">相关文章</div> <ul> <li> <strong> <a href="https://codeqd.com/post/20260922095.html" title="Vue3写组件一定要用单文件SFC的setup写法吗？函数式组件还有用吗？">Vue3写组件一定要用单文件SFC的setup写法吗？函数式组件还有用吗？</a> </strong> <div class="listleft"> <p><a href="https://codeqd.com/post/20260922095.html">很多刚上手Vue3或者正从Vue2平滑迁移的开发者，打开教程或者项目模板，第一看到的几乎都是<script set...</a></p> <div class="listtag"> <a href="https://codeqd.com/tags/Vue3%20SFC%20setup/" target="_blank">Vue3 SFC setup</a><a href="https://codeqd.com/tags/Vue3%E5%87%BD%E6%95%B0%E5%BC%8F%E7%BB%84%E4%BB%B6/" target="_blank">Vue3函数式组件</a> </div> <div class="listinfo"> <span class="time">9小时前</span> <span class="vew">114阅读</span> <span class="cat"><a href="https://codeqd.com/vue/">#Vue</a></span> </div> </div> <div class="img"> <a href="https://codeqd.com/post/20260922095.html"><img src="https://codeqd.com/zb_users/theme/yd1125free/include/random/2.jpg" alt="Vue3写组件一定要用单文件SFC的setup写法吗？函数式组件还有用吗？"></a> </div> </li> <li> <strong> <a href="https://codeqd.com/post/20260922094.html" title="npm">npm</a> </strong> <div class="listleft"> <p><a href="https://codeqd.com/post/20260922094.html">Vue3项目怎么用html2canvas完美生成高清不模糊的长截图？ 最近在做的一个Vue3数据分析后台，需要把仪表盘...</a></p> <div class="listtag"> <a href="https://codeqd.com/tags/Node%E5%8C%85%E7%AE%A1%E7%90%86%E5%99%A8/" target="_blank">Node包管理器</a><a href="https://codeqd.com/tags/JavaScript%E5%8C%85%E7%AE%A1%E7%90%86/" target="_blank">JavaScript包管理</a> </div> <div class="listinfo"> <span class="time">15小时前</span> <span class="vew">181阅读</span> <span class="cat"><a href="https://codeqd.com/vue/">#Vue</a></span> </div> </div> <div class="img"> <a href="https://codeqd.com/post/20260922094.html"><img src="https://codeqd.com/zb_users/theme/yd1125free/include/random/4.jpg" alt="npm"></a> </div> </li> <li> <strong> <a href="https://codeqd.com/post/20260922093.html" title="Vue3项目里总觉得代码乱重复多？怎么封装实用又复用性强的Hooks？">Vue3项目里总觉得代码乱重复多？怎么封装实用又复用性强的Hooks？</a> </strong> <div class="listleft"> <p><a href="https://codeqd.com/post/20260922093.html">最近帮几个朋友改Vue3的老项目重构，发现一个挺普遍的坑：大家把Composition API用成了「大号setup函数...</a></p> <div class="listtag"> <a href="https://codeqd.com/tags/Vue3%20Hooks/" target="_blank">Vue3 Hooks</a><a href="https://codeqd.com/tags/%E5%B0%81%E8%A3%85%E5%A4%8D%E7%94%A8/" target="_blank">封装复用</a> </div> <div class="listinfo"> <span class="time">22小时前</span> <span class="vew">234阅读</span> <span class="cat"><a href="https://codeqd.com/vue/">#Vue</a></span> </div> </div> <div class="img"> <a href="https://codeqd.com/post/20260922093.html"><img src="https://codeqd.com/zb_users/theme/yd1125free/include/random/6.jpg" alt="Vue3项目里总觉得代码乱重复多？怎么封装实用又复用性强的Hooks？"></a> </div> </li> <li> <strong> <a href="https://codeqd.com/post/20260922092.html" title="Vue3写后台管理系统比Vue2好在哪？真的值得立刻重构吗？有哪些避坑点？">Vue3写后台管理系统比Vue2好在哪？真的值得立刻重构吗？有哪些避坑点？</a> </strong> <div class="listleft"> <p><a href="https://codeqd.com/post/20260922092.html">最近收到不少做企业后台、电商后台、SaaS后台的朋友私信，说团队技术栈停在Vue2+ElementUI，但看着主流开源库...</a></p> <div class="listtag"> <a href="https://codeqd.com/tags/Vue3%E5%90%8E%E5%8F%B0%E9%87%8D%E6%9E%84/" target="_blank">Vue3后台重构</a><a href="https://codeqd.com/tags/Vue2Vue3%E5%90%8E%E5%8F%B0%E5%AF%B9%E6%AF%94/" target="_blank">Vue2Vue3后台对比</a> </div> <div class="listinfo"> <span class="time">1天前</span> <span class="vew">382阅读</span> <span class="cat"><a href="https://codeqd.com/vue/">#Vue</a></span> </div> </div> <div class="img"> <a href="https://codeqd.com/post/20260922092.html"><img src="https://codeqd.com/zb_users/theme/yd1125free/include/random/8.jpg" alt="Vue3写后台管理系统比Vue2好在哪？真的值得立刻重构吗？有哪些避坑点？"></a> </div> </li> <li> <strong> <a href="https://codeqd.com/post/20260922091.html" title="Vue3比Vue2到底强在哪？普通开发者选哪个好？">Vue3比Vue2到底强在哪？普通开发者选哪个好？</a> </strong> <div class="listleft"> <p><a href="https://codeqd.com/post/20260922091.html">身边最近半年有不少朋友问起Vue3和Vue2的事儿，要么是项目要重构拿不定主意，要么是刚学前端不知道该先捡哪个入门，其实...</a></p> <div class="listtag"> <a href="https://codeqd.com/tags/%E6%99%AE%E9%80%9A%E5%BC%80%E5%8F%91%E8%80%85Vue%E9%80%89%E5%9E%8B/" target="_blank">普通开发者Vue选型</a> </div> <div class="listinfo"> <span class="time">2天前</span> <span class="vew">454阅读</span> <span class="cat"><a href="https://codeqd.com/vue/">#Vue</a></span> </div> </div> <div class="img"> <a href="https://codeqd.com/post/20260922091.html"><img src="https://codeqd.com/zb_users/theme/yd1125free/include/random/7.jpg" alt="Vue3比Vue2到底强在哪？普通开发者选哪个好？"></a> </div> </li> </ul> </div> </div> <!-- main_side --> <div class="main_side"> <div class="widget widget_user"> <div class="userimg"> <img src="https://codeqd.com/zb_users/avatar/0.png" alt="terry"/> <p><a href="https://codeqd.com/author-1.html" target="_blank">terry</a></p> </div> <div class="userpost"> <h5>作者文章</h5> <ul> <li> <a href="https://codeqd.com/post/20260922095.html" target="_blank">Vue3写组件一定要用单文件SFC的setup写法吗？函数式组件还有用吗？</a> <span>9小时前</span> </li> <li> <a href="https://codeqd.com/post/20260922094.html" target="_blank">npm</a> <span>15小时前</span> </li> <li> <a href="https://codeqd.com/post/20260922093.html" target="_blank">Vue3项目里总觉得代码乱重复多？怎么封装实用又复用性强的Hooks？</a> <span>22小时前</span> </li> <li> <a href="https://codeqd.com/post/20260922092.html" target="_blank">Vue3写后台管理系统比Vue2好在哪？真的值得立刻重构吗？有哪些避坑点？</a> <span>1天前</span> </li> <li> <a href="https://codeqd.com/post/20260922091.html" target="_blank">Vue3比Vue2到底强在哪？普通开发者选哪个好？</a> <span>2天前</span> </li> </ul> </div> <div class="umore"> <a href="https://codeqd.com/author-1.html" target="_blank" rel="nofollow">浏览更多</a> </div> </div> <div class="widget widget_hot"> <div class="title">热门</div> <ul> <li> <i>1</i> <a href="https://codeqd.com/post/20231020059.html" target="_blank"> <strong>跳过当前迭代并进入下一次迭代</strong> <span>一、概述 在C++中，跳过当前迭代并进入下一次迭代可以使用continue语句来实现。当循环遇到continue语句时，将会立即转到下一次循环的开始处，而不执行当前循环中剩余的代码。 通常情况下，continue语句用于在循环中处理特定的情...</span> </a> </li><li> <i>2</i> <a href="https://codeqd.com/post/20231020060.html" target="_blank"> <strong>C++编程技巧分享</strong> <span>一、C++中的const C++中的const限定符可以用于变量、函数参数、函数返回类型等多种情况。使用const限定符可以使代码更加安全、简洁、易于维护。 1、 const变量 const变量在定义后就不能被修改，这使得代码更加安全...</span> </a> </li><li> <i>3</i> <a href="https://codeqd.com/post/20251021376.html" target="_blank"> <strong>一、搜索引擎官方资源，从规则制定者那学底层逻辑</strong> <span>想学好SEO但预算有限？不少刚入行或想转行做SEO的朋友，都在找免费又靠谱的学习渠道，毕竟SEO知识更新快，花钱买课怕踩坑，不如先从免费资源入手，把基础打牢、摸清行业逻辑再进阶，今天就拆透几个「免费学SEO不踩雷」的平台，不管你是纯新手、有...</span> </a> </li><li> <i>4</i> <a href="https://codeqd.com/post/20231020062.html" target="_blank"> <strong>如何为C++函数进行重载</strong> <span>一、什么是函数的重载 函数的重载是指在同一作用域下，可以定义多个同名函数，但是这些同名函数的参数列表必须不同。参数的不同可以是数量上的不同、类型上的不同、顺序上的不同等，只要这些函数的参数列表不完全一致即可。 二、如何实现函数的重载 1...</span> </a> </li><li> <i>5</i> <a href="https://codeqd.com/post/20231020061.html" target="_blank"> <strong>高效处理时间的C++实现</strong> <span>在C++编程中，处理时间是很重要的一环。而对于大规模问题，如数据处理、机器学习、计算机视觉等领域，时间的效率更是至关重要。本文将从多个方面阐述如何在C++编程中高效处理时间。 一、使用STL算法 STL（标准模板库）是C++的一个重要部分...</span> </a> </li><li> <i>6</i> <a href="https://codeqd.com/post/20231120069.html" target="_blank"> <strong>Vue应用开发笔记：Electron Vue开发的实际应用案例</strong> <span>今天，我们来介绍下Electron Vue开发的实际应用案例，一起往下学习吧！开头：Electron Vue开发的实际应用案例随着移动互联网的不断普及，桌面应用程序的需求也越来越多。而Electron Vue作为一种基于JavaScript...</span> </a> </li><li> <i>7</i> <a href="https://codeqd.com/post/20260521841.html" target="_blank"> <strong>Vue3中watch到底怎么用？避坑指南+全场景实例</strong> <span>最近上手Vue3项目的前端小伙伴，好多都会来问：组合式API里的watch好像和之前Vue2的不太一样？一会儿要传ref一会儿传reactive的响应式数据，深度监听要不要加，什么时候用immediate？别急，今天咱们就用一问一答的方式，...</span> </a> </li><li> <i>8</i> <a href="https://codeqd.com/post/20260521842.html" target="_blank"> <strong>或者</strong> <span>Vue3开发中怎么监听DOM元素高度变化，有哪些实用且兼容的方案？ 刚接触Vue3的同学可能会沿用Vue2的watch+ref.offsetHeight的思路，结果发现数据更新后高度没变、异步加载内容后监听不到、窗口缩放时关联布局的高度错...</span> </a> </li><li> <i>9</i> <a href="https://codeqd.com/post/20260521844.html" target="_blank"> <strong>Vue watchEffect到底比watch好在哪？新手应该怎么用不踩坑？</strong> <span>要搞懂Vue watchEffect，得先从它和老熟人watch的对比说起——很多新手刚接触Composition API时，会觉得这俩都是“监听数据变化做事”的API，用哪个都行，但其实场景完全不一样，甚至可以说没有直接的“谁替代谁”关系...</span> </a> </li><li> <i>10</i> <a href="https://codeqd.com/post/20260521845.html" target="_blank"> <strong>Vue3 composition api里的watch deep模式怎么用？踩过的坑和优化方案有哪些？</strong> <span>先搞懂watch和watchEffect的区别——别上来就用watch deep 很多刚接触Vue3组合式API的同学,一碰到要监听复杂数据（比如对象、数组）的深层变化，第一反应就是开watch的deep:true，但其实deep模式真的...</span> </a> </li> </ul> </div> <div class="widget widget_previous"> <div class="title">最新文章</div> <ul> <li> <a href="https://codeqd.com/post/20260922095.html" target="_blank" title="Vue3写组件一定要用单文件SFC的setup写法吗？函数式组件还有用吗？">Vue3写组件一定要用单文件SFC的setup写法吗？函数式组件还有用吗？</a> <span>9小时前</span> </li> <li> <a href="https://codeqd.com/post/20260922094.html" target="_blank" title="npm">npm</a> <span>15小时前</span> </li> <li> <a href="https://codeqd.com/post/20260922093.html" target="_blank" title="Vue3项目里总觉得代码乱重复多？怎么封装实用又复用性强的Hooks？">Vue3项目里总觉得代码乱重复多？怎么封装实用又复用性强的Hooks？</a> <span>22小时前</span> </li> <li> <a href="https://codeqd.com/post/20260922092.html" target="_blank" title="Vue3写后台管理系统比Vue2好在哪？真的值得立刻重构吗？有哪些避坑点？">Vue3写后台管理系统比Vue2好在哪？真的值得立刻重构吗？有哪些避坑点？</a> <span>1天前</span> </li> <li> <a href="https://codeqd.com/post/20260922091.html" target="_blank" title="Vue3比Vue2到底强在哪？普通开发者选哪个好？">Vue3比Vue2到底强在哪？普通开发者选哪个好？</a> <span>2天前</span> </li> <li> <a href="https://codeqd.com/post/20260922090.html" target="_blank" title="Vue3怎么快速准确获取URL参数？动态路由/Query/非路由场景全解决">Vue3怎么快速准确获取URL参数？动态路由/Query/非路由场景全解决</a> <span>2天前</span> </li> <li> <a href="https://codeqd.com/post/20260922089.html" target="_blank" title="Vue3怎么获取组件实例？setup父子孙/动态/混写组合式选项式超全解法">Vue3怎么获取组件实例？setup父子孙/动态/混写组合式选项式超全解法</a> <span>2天前</span> </li> <li> <a href="https://codeqd.com/post/20260922088.html" target="_blank" title="Vue3 has no default export？别慌！看完这篇彻底搞懂怎么解决">Vue3 has no default export？别慌！看完这篇彻底搞懂怎么解决</a> <span>3天前</span> </li> <li> <a href="https://codeqd.com/post/20260922087.html" target="_blank" title="Vue3组合式API Hooks怎么用才规范高效不踩坑？">Vue3组合式API Hooks怎么用才规范高效不踩坑？</a> <span>3天前</span> </li> <li> <a href="https://codeqd.com/post/20260922086.html" target="_blank" title="Vue3 inject是什么？为啥不用props传数据还推荐它？新手怎么避开坑？">Vue3 inject是什么？为啥不用props传数据还推荐它？新手怎么避开坑？</a> <span>3天前</span> </li> </ul> </div> <div class="widget widget_tags"> <div class="title">标签列表</div> <ul><li><a target="_blank" href="https://codeqd.com/tags/PHP/">PHP</a></li><li><a target="_blank" href="https://codeqd.com/tags/PHP%20microtime/">PHP microtime</a></li><li><a target="_blank" href="https://codeqd.com/tags/Mysql/">Mysql</a></li><li><a target="_blank" href="https://codeqd.com/tags/PHP%20dirname%28%29/">PHP dirname()</a></li><li><a target="_blank" href="https://codeqd.com/tags/PHP%20Select/">PHP Select</a></li><li><a target="_blank" href="https://codeqd.com/tags/str_replace%E5%87%BD%E6%95%B0/">str_replace函数</a></li><li><a target="_blank" href="https://codeqd.com/tags/sscanf%E5%87%BD%E6%95%B0/">sscanf函数</a></li><li><a target="_blank" href="https://codeqd.com/tags/PHP%E7%9A%84Explode%E5%87%BD%E6%95%B0/">PHP的Explode函数</a></li><li><a target="_blank" href="https://codeqd.com/tags/PHP%20sort/">PHP sort</a></li><li><a target="_blank" href="https://codeqd.com/tags/in_array%28%29/">in_array()</a></li><li><a target="_blank" href="https://codeqd.com/tags/addAttribute/">addAttribute</a></li><li><a target="_blank" href="https://codeqd.com/tags/MD5%E5%80%BC/">MD5值</a></li><li><a target="_blank" href="https://codeqd.com/tags/PHP%E5%B7%A5%E7%A8%8B%E5%B8%88/">PHP工程师</a></li><li><a target="_blank" href="https://codeqd.com/tags/PHP%E6%AD%A3%E5%88%99%E8%A1%A8%E8%BE%BE%E5%BC%8F/">PHP正则表达式</a></li><li><a target="_blank" href="https://codeqd.com/tags/PHP%20Date%28%29/">PHP Date()</a></li><li><a target="_blank" href="https://codeqd.com/tags/%E6%95%B0%E6%8D%AE%E5%BA%93/">数据库</a></li><li><a target="_blank" href="https://codeqd.com/tags/php%E8%BF%9E%E6%8E%A5mysql/">php连接mysql</a></li><li><a target="_blank" href="https://codeqd.com/tags/phpmysql/">phpmysql</a></li><li><a target="_blank" href="https://codeqd.com/tags/mybatis/">mybatis</a></li><li><a target="_blank" href="https://codeqd.com/tags/jsp%E8%BF%9E%E6%8E%A5mysql/">jsp连接mysql</a></li><li><a target="_blank" href="https://codeqd.com/tags/navicatmysqllinux/">navicatmysqllinux</a></li><li><a target="_blank" href="https://codeqd.com/tags/MySQL%20Workbench/">MySQL Workbench</a></li><li><a target="_blank" href="https://codeqd.com/tags/MySQL%E6%95%B0%E6%8D%AE%E5%BA%93/">MySQL数据库</a></li><li><a target="_blank" href="https://codeqd.com/tags/mysql%20cte/">mysql cte</a></li><li><a target="_blank" href="https://codeqd.com/tags/Linux/">Linux</a></li></ul> </div> </div></div> <div class="footer"> <div class="container">Copyright by <a href="/">code前端网</a> All Rights Reserved.<a href="https://beian.miit.gov.cn/" target="_blank" rel="noopener">粤ICP备12067512号-4</a> <p style="display:none;"> Powered By <a href="https://www.zblogcn.com/" title="Z-BlogPHP 1.7.5 Build 173540" target="_blank" rel="noopener noreferrer">Z-BlogPHP</a> Theme By <a href="https://www.htmlit.com.cn/" target="_blank">编程老白</a></p></div> </div><div id="goTop" class="goTop"><i class="fa fa-angle-up"></i></div><script src="https://codeqd.com/zb_users/theme/yd1125free/script/common.js?v=1.2.4" type="text/javascript"></script> <script src="https://codeqd.com/zb_users/theme/yd1125free/script/custom.js?v=1.2.4" type="text/javascript"></script> <script>jQuery(document).ready(function($) {jQuery('.main_left').theiaStickySidebar({ additionalMarginTop: 10,});});</script><script src="https://codeqd.com/zb_users/plugin/YtUser/style/js/frontend.js"></script> <script src="https://codeqd.com/zb_users/plugin/FY_Prettify/prettify.js" type="text/javascript"></script> <script type="text/javascript">var zbPath="https://codeqd.com/", codeAll = 0, copyRights = 1, copyTips = "本段代码来自 ", codeText = 0, textHeight = 200, sButton = "0|0|0|0", codeFold = 0; document.writeln(unescape("%3Cscript src=\""+zbPath+"zb_users/plugin/Codemo_vip/js/main.js?v=3.3.0\" type=\"text/javascript\"%3E%3C/script%3E"));</script> </body> </html> <!--42.52 ms , 20 queries , 4861kb memory , 2 errors-->