鱼C论坛

 找回密码
 立即注册
查看: 3472|回复: 2

[已解决]dom节点问题

[复制链接]
发表于 2017-5-15 23:42:41 | 显示全部楼层 |阅读模式
5鱼币
  1. <!doctype html>
  2. <html lang="en">
  3. <head>
  4.         <meta charset="UTF-8" />
  5.         <title></title>
  6.         <style type="text/css">

  7.         </style>
  8.         <script type="text/javascript">
  9.                 window.onload = function()
  10.                 {
  11.                         function styleHeaderSibings(){
  12.                                 if(!document.getElementsByTagName)
  13.                                 {
  14.                                         return false;
  15.                                 }
  16.                                 var headers = document.getElementsByTagName("h1");
  17.                                 var elem;
  18.                                
  19.                                 for(var i = 0; i < headers.length; i++)
  20.                                 {
  21.                                         elem = getNextElement(headers[i].nextSibling);
  22.                                        
  23.                                         elem.style.fontWeight = "bold";
  24.                                         elem.style.fontSize = "40px";
  25.                                         elem.style.color = "red";
  26.                                 }
  27.                         }
  28.                 }
  29.                
  30.                 function getNextElement(node)
  31.                 {
  32.                         if(node.nodeType == 1)
  33.                         {
  34.                                 return node;
  35.                         }
  36.                        
  37.                         if(node.nextSibling)
  38.                         {
  39.                                 return getNextElement(node.nextSilbing);
  40.                         }
  41.                         return null;
  42.                 }
  43.         </script>
  44. </head>
  45. <body>
  46.         <h1>a</h1>
  47.         <h1>b</h1>
  48.         <h1>c</h1>
  49.         <h1>d</h1>
  50. </body>
  51. </html>
复制代码



设置了字体等没反应F12也没错,  求救 ==   
最佳答案
2017-5-15 23:42:42
本帖最后由 不二如是 于 2017-5-17 22:35 编辑

先抛开,DOM树遍历方法正确与否不说。。。

居然要对<h1>这中内置好样式的标签修改大小,就很尴尬了!

建议换成<p>标签,然后放在一个div里

在利用便利一个,id为xxx的div下所有子节点的办法,修改<p>样式




  1. <!doctype html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8" />
  5.     <title></title>
  6.     <style type="text/css">

  7.     </style>
  8.     <script type="text/javascript">
  9.         var adiv=document.querySelectorAll("#d1 p");
  10. for(i=0;i<adiv.length;i++){
  11.     adiv[i].style.color="red";
  12.     adiv[i].style.fontSize="55px";
  13. }
  14.     </script>
  15. </head>
  16. <body>
  17. <div id="try">
  18. <p>a</p>
  19. <p>b</p>
  20. <p>c</p>
  21. <p>d</p>
  22. <p>e</p>
  23. </div>

  24. </body>
  25. </html>
复制代码


最佳答案

查看完整内容

先抛开,DOM树遍历方法正确与否不说。。。 居然要对这中内置好样式的标签修改大小,就很尴尬了! 建议换成标签,然后放在一个div里 在利用便利一个,id为xxx的div下所有子节点的办法,修改样式 [hr]
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复

使用道具 举报

发表于 2017-5-15 23:42:42 | 显示全部楼层    本楼为最佳答案   
本帖最后由 不二如是 于 2017-5-17 22:35 编辑

先抛开,DOM树遍历方法正确与否不说。。。

居然要对<h1>这中内置好样式的标签修改大小,就很尴尬了!

建议换成<p>标签,然后放在一个div里

在利用便利一个,id为xxx的div下所有子节点的办法,修改<p>样式




  1. <!doctype html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8" />
  5.     <title></title>
  6.     <style type="text/css">

  7.     </style>
  8.     <script type="text/javascript">
  9.         var adiv=document.querySelectorAll("#d1 p");
  10. for(i=0;i<adiv.length;i++){
  11.     adiv[i].style.color="red";
  12.     adiv[i].style.fontSize="55px";
  13. }
  14.     </script>
  15. </head>
  16. <body>
  17. <div id="try">
  18. <p>a</p>
  19. <p>b</p>
  20. <p>c</p>
  21. <p>d</p>
  22. <p>e</p>
  23. </div>

  24. </body>
  25. </html>
复制代码


想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复

使用道具 举报

发表于 2017-5-16 14:28:39 | 显示全部楼层
火狐不支持getElementsByTagName这个语句所以也没法调试
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

小黑屋|手机版|Archiver|鱼C工作室 ( 粤ICP备18085999号-1 | 粤公网安备 44051102000585号)

GMT+8, 2024-3-29 23:04

Powered by Discuz! X3.4

© 2001-2023 Discuz! Team.

快速回复 返回顶部 返回列表