js监听DOM的变化

前端之家收集整理的这篇文章主要介绍了js监听DOM的变化前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

<table class="javascript"><tr class="li1">
<td class="ln"><pre class="de1">1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87

内容变化并作出反应,由于是div的内容变化,用change无法完成,就百度了一下,做了个总结。         用以下三个事件就可以达到效果了                 (1)DOMSubtreeModified:在DOM结构中发生的任何变化时触发。这个事件在其他任何事件触发后都会触发。           (2)DOMNodeInserted:在一个节点作为子节点被插入到另一个节点中时触发。           (3)DOMNodeRemoved:在节点从其父节点中被移除时触发。         于是我自己做了个小小的测试:           事件监听@H_<a href="/tag/404/" target="_blank" class="keywords">404</a>_6@         <<a href="/tag/Meta/" target="_blank" class="keywords">Meta</a> charset="utf-8">         <script type="text/javascript" src="jQuery.js"></script>         <style type="text/css">         #main_contain{                 width: 300px;                 height: 100%;                 border-width: 1px;                 border-style: solid;         }         ul>li{                 width: 100px;                 height: 30px;                 border-width: 1px;                 border-style: solid;         }         </style> </head> <body> <div id="main_contain">         <ul>                 <li>1</li>                 <li>2</li>                 <li>3</li>         </ul> </div> <div id="text_contain">         <textarea>测试文本</textarea> </div> <button id="del_ele"><a href="/tag/tianjia/" target="_blank" class="keywords">添加</a>元素</button> <button id="change_text">改变文档</button>   </body> <span class="sy0"><</span>script type<span class="sy0">=</span><span class="st0">"text/javascript"</span><span class="sy0">></span>         $<span class="br0">(</span><span class="st0">'#del_ele'</span><span class="br0">)</span>.<span class="me1">click</span><span class="br0">(</span><span class="kw1">function</span><span class="br0">(</span><span class="br0">)</span><span class="br0">{</span>                 <span class="kw1">var</span> html<span class="sy0">=</span><span class="st0">"<li>3</li>"</span><span class="sy0">;</span>                 $<span class="br0">(</span><span class="st0">'#main_contain>ul'</span><span class="br0">)</span>.<span class="me1">append</span><span class="br0">(</span>html<span class="br0">)</span><span class="sy0">;</span>         <span class="br0">}</span><span class="br0">)</span>           $<span class="br0">(</span>document<span class="br0">)</span>.<span class="me1">on</span><span class="br0">(</span><span class="st0">'click'</span><span class="sy0">,</span><span class="st0">'#main_contain ul li'</span><span class="sy0">,</span><span class="kw1">function</span><span class="br0">(</span><span class="br0">)</span><span class="br0">{</span>                 $<span class="br0">(</span><span class="kw1">this</span><span class="br0">)</span>.<span class="me1">remove</span><span class="br0">(</span><span class="br0">)</span><span class="sy0">;</span>         <span class="br0">}</span><span class="br0">)</span>         <span class="co1">//DOM<a href="/tag/zengjia/" target="_blank" class="keywords">增加</a>或者<a href="/tag/shanchu/" target="_blank" class="keywords">删除</a>时触发,同时绑定和DOMSubtreeModified相同</span>         $<span class="br0">(</span><span class="st0">'#main_contain'</span><span class="br0">)</span>.<span class="me1">bind</span><span class="br0">(</span><span class="st0">'DOMNodeInserted DOMNodeRemoved'</span><span class="sy0">,</span><span class="kw1">function</span><span class="br0">(</span><span class="br0">)</span><span class="br0">{</span>                 <span class="co1">//some operation</span>                 alert<span class="br0">(</span><span class="st0">'DOM被改变'</span><span class="br0">)</span><span class="sy0">;</span>         <span class="br0">}</span><span class="br0">)</span>         <span class="co1">//DOM发生变化后触发</span>         $<span class="br0">(</span><span class="st0">'#main_contain'</span><span class="br0">)</span>.<span class="me1">bind</span><span class="br0">(</span><span class="st0">'DOMSubtreeModified'</span><span class="sy0">,</span><span class="kw1">function</span><span class="br0">(</span><span class="br0">)</span><span class="br0">{</span>                 <span class="co1">//some operation</span>                 alert<span class="br0">(</span><span class="st0">'DOM被改变'</span><span class="br0">)</span><span class="sy0">;</span>         <span class="br0">}</span><span class="br0">)</span>         <span class="co1">//文本的操作也基本相同</span>         $<span class="br0">(</span><span class="st0">'#change_text'</span><span class="br0">)</span>.<span class="me1">click</span><span class="br0">(</span><span class="kw1">function</span><span class="br0">(</span><span class="br0">)</span><span class="br0">{</span>                 <span class="kw1">var</span> textNode <span class="sy0">=</span> $<span class="br0">(</span><span class="st0">'#text_contain'</span><span class="br0">)</span>.<span class="me1">find</span><span class="br0">(</span><span class="st0">'textarea'</span><span class="br0">)</span><span class="sy0">;</span>                 <span class="kw1">var</span> text <span class="sy0">=</span> textNode.<span class="me1">text</span><span class="br0">(</span><span class="br0">)</span><span class="sy0">;</span>                 textChanged <span class="sy0">=</span> text <span class="sy0">+</span> <span class="st0">'已经被改变'</span><span class="sy0">;</span>                 textNode.<span class="me1">text</span><span class="br0">(</span>textChanged<span class="br0">)</span><span class="sy0">;</span>                 <span class="co1">//textNode.empty();</span>         <span class="br0">}</span><span class="br0">)</span>           $<span class="br0">(</span><span class="st0">'#text_contain'</span><span class="br0">)</span>.<span class="me1">bind</span><span class="br0">(</span><span class="st0">'DOMNodeRemoved'</span><span class="sy0">,</span><span class="kw1">function</span><span class="br0">(</span><span class="br0">)</span><span class="br0">{</span>                 <span class="co1">//some operation</span>                 alert<span class="br0">(</span><span class="st0">'文本被改变'</span><span class="br0">)</span><span class="sy0">;</span>         <span class="br0">}</span><span class="br0">)</span> <span class="sy0"></</span>script<span class="sy0">></span>   </html>         这里用的是jquery 1.11 版本的,没有live等<a href="/tag/fangfa/" target="_blank" class="keywords">方法</a>了。         如有<a href="/tag/cuowu/" target="_blank" class="keywords">错误</a>欢迎指正。</pre></td> </tr></tbody></table></div> <div class="topcard-tags"><a href="/tag/jsjiantingDOMdebianhua/" class="tag_link" target="_blank">js监听DOM的变化</a></div> <ul class="list-group"> <li class="list-group-item"><a href="/note/422530.html" title="循环不变性">上一篇:循环不变性</a><a href="/note/422528.html" title="如何实现multi(2)(3)(4) --有限或无限加参数" class="text-muted pull-right">下一篇:如何实现multi(2)(3)(4) --有限或无</a> </li> </ul> </div> </div> </div> <!-- row end --> <div class="row row-sm"> <div class="col-sm-12 col-md-12 col-lg-12"> <div class="card"> <ins class="adsbygoogle" style="display:block" data-ad-format="autorelaxed" data-ad-client="ca-pub-4605373693034661" data-ad-slot="9144498553"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script></div> </div> </div> <div class="row row-sm"> <div class="col-sm-12 col-md-12 col-lg-12"> <div class="card"> <div class="title"><h1>猜你在找的程序笔记相关文章</h1></div> <div class="list_con"> <a href="/note/996782.html" title="解决Connection to `ssl://pecl.php.net:443' failed"><div class="title">解决Connection to `ssl://pecl.php.net:443' failed</div> <div class="summary">这个问题和curl无法访问https资源是类似的,现在curl可以访问https资源,但是使用pecl安装扩...</div> <time class="summary">作者:前端之家 时间:2024-09-28</time> </a> </div> <div class="list_con"> <a href="/note/995756.html" title="Chrome无法显示全网址怎么处理?Chrome系浏览器显示完整地址"><div class="title">Chrome无法显示全网址怎么处理?Chrome系浏览器显示完整地址</div> <div class="summary">在浏览器输入chrome://flags/回车,找到Omnibox UI Hide Steady-State URL Scheme and Tri...</div> <time class="summary">作者:前端之家 时间:2024-09-28</time> </a> </div> <div class="list_con"> <a href="/note/995699.html" title="Ubuntu 18.04安装arm-linux-gcc交叉编译器的两种方法(附下载地址)"><div class="title">Ubuntu 18.04安装arm-linux-gcc交叉编译器的两种方法(附下载地址)</div> <div class="summary">方法一: 我们都知道Ubuntu有一个专门用来安装软件的工具apt,我们可以用它来全自动安装ar...</div> <time class="summary">作者:前端之家 时间:2024-09-28</time> </a> </div> <div class="list_con"> <a href="/note/995698.html" title="VCODE修改控制台编码格式解决输出乱码问题"><img class="lazy" src="/images/np.jpg" data-original="/res/2021/01-30/23/ca5ea199cbb2254cc60030c967062f11.png" title="" width="160" height="90" style="float:right;margin-left:30px;display:none;" /><div class="title">VCODE修改控制台编码格式解决输出乱码问题</div> <div class="summary">中文的windows下的cmd默认使用GBK的编码,敲代码时,页面使用的是UTF-8(65001),而powershe...</div> <time class="summary">作者:前端之家 时间:2024-09-28</time> </a> </div> <div class="list_con"> <a href="/note/995697.html" title="编译busybox错误汇总"><div class="title">编译busybox错误汇总</div> <div class="summary">提示错误: arm-linux-gcc:Command not found PATH里有/usr/oca/arm/bin,但是make的时候,...</div> <time class="summary">作者:前端之家 时间:2024-09-28</time> </a> </div> <div style="border-bottom: 1px solid #f4f4f4;margin-top:20px;"> <ins class="adsbygoogle" style="display:block" data-ad-format="fluid" data-ad-layout-key="-fr-2o+fp-dx-wx" data-ad-client="ca-pub-4605373693034661" data-ad-slot="4561116489"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div><div class="list_con"> <a href="/note/995365.html" title="Bundle SPFX 文件时报错 “The build failed because a task wrote output to stderr.”的解决办法"><img class="lazy" src="/images/np.jpg" data-original="/res/2021/01-26/08/053c5912c7938467781334a0f01e31c5.png" title="" width="160" height="90" style="float:right;margin-left:30px;display:none;" /><div class="title">Bundle SPFX 文件时报错 “The build failed because a task wrote output to stderr.”的解决办法</div> <div class="summary">在使用gulp bundle --ship对spfx项目进行编译的时候,出现“The build failed because a t...</div> <time class="summary">作者:前端之家 时间:2024-09-28</time> </a> </div> <div class="list_con"> <a href="/note/995364.html" title="处理Graph API .NET SDK 的分页请求"><div class="title">处理Graph API .NET SDK 的分页请求</div> <div class="summary">当使用Graph API进行查询的时候,如果结果过多,Graph API会对返回结果进行分页。 例如,下...</div> <time class="summary">作者:前端之家 时间:2024-09-28</time> </a> </div> <div class="list_con"> <a href="/note/995363.html" title="自动化部署SharePoint Online modern site的注意事项"><div class="title">自动化部署SharePoint Online modern site的注意事项</div> <div class="summary">整个流程是用户在SharePoint site里发起创建新team site的请求,管理员审核通过后,Power ...</div> <time class="summary">作者:前端之家 时间:2024-09-28</time> </a> </div> <div class="list_con"> <a href="/note/995207.html" title="安装Office套件和Visio可能遇到的问题"><img class="lazy" src="/images/np.jpg" data-original="/res/2021/01-14/08/c819a1948189ca9fdb205469b7766211.png" title="" width="160" height="90" style="float:right;margin-left:30px;display:none;" /><div class="title">安装Office套件和Visio可能遇到的问题</div> <div class="summary">相关描述 安装可能出现的问题: 电脑系统: win10 教育版 本次安装版本为: Office 2016 c...</div> <time class="summary">作者:前端之家 时间:2024-09-28</time> </a> </div> <div class="list_con"> <a href="/note/995206.html" title="打印机相关整理"><img class="lazy" src="/images/np.jpg" data-original="/res/2021/01-14/08/d31d7c1325ae0dec0ce3910ed178d137.png" title="" width="160" height="90" style="float:right;margin-left:30px;display:none;" /><div class="title">打印机相关整理</div> <div class="summary">佳能打印机清零 版本号:佳能 ip2788 出现问题:错误代码:5B00 原因:打印机计数满,需要...</div> <time class="summary">作者:前端之家 时间:2024-09-28</time> </a> </div> <div style="border-bottom: 1px solid #f4f4f4;margin-top:20px;"> <ins class="adsbygoogle" style="display:block" data-ad-format="fluid" data-ad-layout-key="-fr-2o+fp-dx-wx" data-ad-client="ca-pub-4605373693034661" data-ad-slot="4561116489"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div></div> </div> </div> </div> <!-- left end--> <!-- right --> <div class="col-sm-12 col-md-12 col-lg-3"> <!-- row --> <div class="row row-sm"> <div class="col-sm-12 col-md-12 col-lg-12"> <div class="card"> <label class="main-content-label ">编程分类</label> <div class="cate mt-20"><a href="/note/" title="程序笔记">程序笔记</a><a href="/seo/" title="SEO">SEO</a><div class="clearfix"></div> </div> </div> </div> </div> <!-- row end --> <!-- row --> <div class="row row-sm"> <div class="col-sm-12 col-md-12 col-lg-12"> <div class="card"> <!-- f2er-rightads --> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-4605373693034661" data-ad-slot="7756441254" data-ad-format="auto" data-full-width-responsive="true"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div> </div> </div> <!-- row end --> <!-- row --> <div class="row row-sm"> <div class="col-sm-12 col-md-12 col-lg-12"> <div class="card"> <label class="main-content-label ">最新文章</label> <ul class="n-list"><li><a href="/note/996782.html" title="解决Connection to `ssl://pecl.php.net:443' failed" target="_blank">• 解决Connection to `ssl:/</a></li> <li><a href="/note/995756.html" title="Chrome无法显示全网址怎么处理?Chrome系浏览器显示完整地址" target="_blank">• Chrome无法显示全网址怎么</a></li> <li><a href="/note/995699.html" title="Ubuntu 18.04安装arm-linux-gcc交叉编译器的两种方法(附下载地址)" target="_blank">• Ubuntu 18.04安装arm-linu</a></li> <li><a href="/note/995698.html" title="VCODE修改控制台编码格式解决输出乱码问题" target="_blank">• VCODE修改控制台编码格式解</a></li> <li><a href="/note/995697.html" title="编译busybox错误汇总" target="_blank">• 编译busybox错误汇总</a></li> <li><a href="/note/995366.html" title="Graph Explore的使用介绍" target="_blank">• Graph Explore的使用介绍</a></li> <li><a href="/note/995365.html" title="Bundle SPFX 文件时报错 “The build failed because a task wrote output to stderr.”的解决办法" target="_blank">• Bundle SPFX 文件时报错 “</a></li> <li><a href="/note/995364.html" title="处理Graph API .NET SDK 的分页请求" target="_blank">• 处理Graph API .NET SDK 的</a></li> <li><a href="/note/995363.html" title="自动化部署SharePoint Online modern site的注意事项" target="_blank">• 自动化部署SharePoint Onl</a></li> <li><a href="/note/995207.html" title="安装Office套件和Visio可能遇到的问题" target="_blank">• 安装Office套件和Visio可能</a></li> </ul> </div> </div> </div> <!-- row end --> <!-- row --> <div class="row row-sm"> <div class="col-sm-12 col-md-12 col-lg-12"> <div class="card"> <label class="main-content-label ">热门标签 <span class="pull-right tx-12"> <a href="/all" target="_blank">更多 ►</a></span> </label> <div class="topcard-tags"><a href="/tag/wanzhengdizhi/" title="完整地址" target="_blank">完整地址</a><a href="/tag/quanwangzhi/" title="全网址" target="_blank">全网址</a><a href="/tag/getattribute/" title=".get_attribute" target="_blank">.get_attribu</a><a href="/tag/GraphExplore/" title="Graph Explore" target="_blank">Graph Explor</a><a href="/tag/wangzhanseo/" title="网站seo" target="_blank">网站seo</a><a href="/tag/minglingbaocuo/" title="命令报错" target="_blank">命令报错</a><a href="/tag/tihuanphp7/" title="替换php7" target="_blank">替换php7</a><a href="/tag/caixiejiyi/" title="采撷记(一)" target="_blank">采撷记(一)</a><a href="/tag/WTF/" title="WTF?" target="_blank">WTF?</a><a href="/tag/HOMEBREWGITHUBAPITOKEN/" title="HOMEBREW_GITHUB_API_TOKEN" target="_blank">HOMEBREW_GIT</a><a href="/tag/FormDataduixiangfasongwenjian/" title="FormData对象发送文件" target="_blank">FormData对象</a><a href="/tag/shujumoxingdeguanlianshanchu/" title="数据模型的关联删除" target="_blank">数据模型的关</a><a href="/tag/yilaiguanxichaxun/" title="依赖关系查询" target="_blank">依赖关系查询</a><a href="/tag/iOSkaifachangyonghong/" title="iOS开发常用宏" target="_blank">iOS开发常用宏</a><a href="/tag/utiljschangyongjsgongnengdabao/" title="util.js----常用js功能打包" target="_blank">util.js----常</a><a href="/tag/UILabelshezhiwenzixingjianjubingjuzhongxianshi/" title="UILabel 设置文字行间距并居中显示" target="_blank">UILabel 设置</a><a href="/tag/reverseadminpy/" title="reverseadmin.py" target="_blank">reverseadmin</a><a href="/tag/phppipeizhongwen/" title="php匹配中文" target="_blank">php匹配中文</a><a href="/tag/ngconf/" title="ngconf" target="_blank">ngconf</a><a href="/tag/dangqianqiantishiziduanleixingyizhi/" title="当前前提是字段类型一致)" target="_blank">当前前提是字</a><a href="/tag/mongozhixingbijiaochaxunziduanzhijiandebijiao/" title="mongo执行比较查询(字段之间的比较" target="_blank">mongo执行比较</a><a href="/tag/mongoshixianziwendangderenyichaxun/" title="mongo实现子文档的任意查询" target="_blank">mongo实现子文</a><a href="/tag/huanyongSublimeText3bingjiejuebianmawenti/" title="--换用Sublime Text3并解决编码问题" target="_blank">--换用Sublim</a><a href="/tag/jsmodule/" title="js module" target="_blank">js module</a><a href="/tag/UseLaraveltoDownloadtableasCSV/" title="Use Laravel to Download table as CSV" target="_blank">Use Laravel </a><a href="/tag/throttleshixian/" title="throttle 实现" target="_blank">throttle 实现</a><a href="/tag/YII2chengxuneihuoquActiveRecordsuozhixingdeSQLyuju/" title="YII2 程序内获取 ActiveRecord 所执行的 SQL 语句" target="_blank">YII2 程序内获</a><a href="/tag/YII2MongoDBActiveRecordgtexample/" title="YII2 MongoDB ActiveRecord $gt example" target="_blank">YII2 MongoDB</a><a href="/tag/jsgenjupianyijisuanriqi/" title="js根据偏移计算日期" target="_blank">js根据偏移计</a><a href="/tag/Linuxxiazhongyaodemulu/" title="--Linux下重要的目录" target="_blank">--Linux下重要</a></div> </div> </div> </div> <!-- row end --> <!-- row --> <div class="row row-sm"> <div class="col-sm-12 col-md-12 col-lg-12"> <div class="card"> <!-- f2er-rightads --> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-4605373693034661" data-ad-slot="7756441254" data-ad-format="auto" data-full-width-responsive="true"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div> </div> </div> <!-- row end --> </div> <!-- right end --> </div> </div> <footer id="footer"> <div class="container"> <div class="row hidden-xs"> <dl class="col-sm-6 site-link"> <dt>最近更新</dt><dd><a href="/win11/1005328.html" title="小米手机重装系统价格多少?专业维修服务详解" target="_blank">· 小米手机重装系统价格多少?专业维修服务详解</a><span class="text-muted pull-right">02-05</span></dd> <dd><a href="/win11/1005327.html" title="手把手教你重装电脑系统,让你的电脑焕然一新!" target="_blank">· 手把手教你重装电脑系统,让你的电脑焕然一新!</a><span class="text-muted pull-right">02-05</span></dd> <dd><a href="/win11/1005326.html" title="教你一步步重装XP系统,让你的电脑重获新生" target="_blank">· 教你一步步重装XP系统,让你的电脑重获新生</a><span class="text-muted pull-right">02-05</span></dd> <dd><a href="/win11/1005325.html" title="从备份到上网:一步步教你重装电脑系统" target="_blank">· 从备份到上网:一步步教你重装电脑系统</a><span class="text-muted pull-right">02-05</span></dd> <dd><a href="/win11/1005324.html" title="Sony笔记本电脑一键重装系统详细图文教程" target="_blank">· Sony笔记本电脑一键重装系统详细图文教程</a><span class="text-muted pull-right">02-05</span></dd> <dd><a href="/win11/1005323.html" title="Lenovo笔记本重装系统超详细教程,小白也能轻松上手" target="_blank">· Lenovo笔记本重装系统超详细教程,小白也能轻松...</a><span class="text-muted pull-right">02-05</span></dd> <dd><a href="/win11/1005322.html" title="联想笔记本一键重装Win10系统详细教程" target="_blank">· 联想笔记本一键重装Win10系统详细教程</a><span class="text-muted pull-right">02-05</span></dd> <dd><a href="/win11/1005321.html" title="电脑系统故障无需愁,专业维修店帮你重装旧貌换新颜" target="_blank">· 电脑系统故障无需愁,专业维修店帮你重装旧貌换新...</a><span class="text-muted pull-right">02-05</span></dd> <dd><a href="/win11/1005320.html" title="联想笔记本一键重装Win10系统图文教程,小白也能轻松搞定!" target="_blank">· 联想笔记本一键重装Win10系统图文教程,小白也能...</a><span class="text-muted pull-right">02-05</span></dd> <dd><a href="/win11/1005319.html" title="笔记本重装系统图文教程:从光盘启动一步到位" target="_blank">· 笔记本重装系统图文教程:从光盘启动一步到位</a><span class="text-muted pull-right">02-05</span></dd> </dl> <dl class="col-sm-4 site-link"> <dt>好站推荐</dt><dd> <a href="https://www.runoob.com" title="菜鸟教程(www.runoob.com)提供了编程的基础技术教程, 介绍了HTML、CSS、Javascript、Python,Java,Ruby,C,PHP , MySQL等各种编程语言的基础知识。 同时本站中也提供了大量的在线实例,通过实例,您可以更好的学习编程。" target="_blank">菜鸟教程</a></dd><dd> <a href="https://www.jb51.cc" title="编程之家(www.jb51.cc)是成立于2017年面向全球中文开发者的技术内容分享平台。提供编程导航、编程问答、编程博文、编程百科、编程教程、编程工具、编程实例等开发者最需要的编程技术内容与开发工具支持,与你一起学习编程,相信编程改变未来!" target="_blank">编程之家</a></dd><dd> <a href="" title="前端之家 f2er.com 前端开发人员所需学习知识手册。" target="_blank">前端之家</a></dd></dl> <dl class="col-sm-2 site-link"> <dt>商务合作</dt> <dd><a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=76874919&site=qq&menu=yes">联系我们</a></dd> </dl> </div> <div class="copyright"> Copyright © 2019 前端之家. 当前版本 V7.0.16<br> <span class="ml5">前端之家 版权所有 <a href="https://beian.miit.gov.cn/" target="_blank" rel="nofollow">闽ICP备13020303号-10</a></span> </div> </div> </footer> <script type="text/javascript" src="/js/base.js"></script> </body> </html>