博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
第一个项目初步完成之后的小结
阅读量:6281 次
发布时间:2019-06-22

本文共 2838 字,大约阅读时间需要 9 分钟。

hot3.png

1.设置一个div的高度用的是$("#id").css("height","200"),而不是$("#id").attr("height","200");
2.dedeCMS中分页的页面的默认样式在/templets/default/style/page.css文件的第77行到112行(从.dede_pages开始到.dede_pages .pageinfo strong结束);
3.关于使用dedeCMS建站时导航功能的实现(以及和二级导航栏目):
  {dede:channelartlist typeid='1,3,9,14,15,16,20' }
     <li  class='liUnclick'>
       <a href="{dede:field name='typeurl'/}" >{dede:field name='typename'/}</a><!---->
          <ul class="xiala_menu" >
          {dede:channel type='son' noself='yes'  }
                <li><a href='[field:typelink/]'>[field:typename/]</a></li> <!---->
          {/dede:channel}
         </ul> 
    </li> 
{/dede:channelartlist}
4.关于给被点击的导航栏目添加样式(“首页”栏目的样式不一样,其它栏目的都一样)
  旧思路:每点击一个导航区域,就给这个点击的区域添加上被点击的样式,其它的同级就去掉这个样式,代码:
<script type="text/javascript">
$(function(){
 
        //点击之后之后添加新的样式,同级去掉点击后添加的样式
        $("#nav>li").click(function(e){
          //e.preventDefault();
          var index=$("#nav>li").index($(this));
           if(index==0){
               $(this).addClass("menu_home2");
               $("#nav>li:eq(0)").removeClass("liClicked");
           }else{
              $(this).addClass("liClicked").siblings("li").removeClass("liClicked");
              $("#nav>li:eq(0)").removeClass("menu_home2");
          }
        });
       
})
</script>
结果:如果点击的超练级跳转了,那么被点击添加的演示就添加无效,因为超链接跳转了;如果阻止超链接的跳转(添加:e.preventDefault()),那么样式可以实现,但是超链接将不能跳转,导致不能读取相应页面的数据;——最终结果:失败;
 新思路:将当前地址栏中的地址和超链接中的地址进行对比,如果匹配,就加上被点击的样式,代码:
<script type="text/javascript">
$(function(){
 
        //点击之后之后添加新的样式,同级去掉点击后添加的样式
var locationStr=window.location.href.substring(22);
$("#nav>li:gt(0)").each(function(){
  var href=$(this).children("a").attr("href");
  if(locationStr==href){
     $(this).addClass("liClicked");
     $("#nav>li:eq(0)").removeClass("menu_home2");
  }
});
})
</script>
  结果:代码量大大减少,成功实现效果。
4.关于jQuery没有执行的原因:
  a.没有引入jQuery库文件;
  b.jQuery写的有错误;
  c.元素尚未加载完全——解决方案($(document).ready()事件):将jQuery代码写在以下代码中:
    $(document).ready(function(){ //该函数内的所有代码都将在DOM加载完成后,页面全部内容(图片等)加载完前执行;可以多次调用;也可以将多段独立代码合并到一个中。
         //脚本
    });
    以上代码的简写形式:
    $(function(){
        //脚本    
    });
   相关知识点:window.onload事件
   window.onload()=function(){ //必须等到页面所有的(全部的)元素都加载完成以后才会执行,不能多次调用,后面的会覆盖前面的。
       //脚本
   };
   
   
5.网页加载很忙慢的原因:Google的统计代码加载很慢,经常在浏览器状态栏里看到Google的统计代码链接在运行,而就在这个过程,导致网页被卡住了。
6.html图片热点map标签的使用:
   (1).用法:<map><area /></map>
       a.<area/>用来定义图像映射区域(映射区域:指带有超链接或者是相关事件的区域);
       b.<area/>总是在<map></map>中间;       
  (2).定义区域点的坐标:
      a.矩形:必须使用四个数字,前两个位左上角坐标,后两个位右下角坐标:
        <area shape="rect" coords="0,0,70,20" href="1.html" />
      b.圆形:必须使用三个数字,前两个为圆心坐标,后一个味半径长度:
        <area shape="circle" coords="10,30,,15" href="2.html" />
      c.任意多边形:将图形每一次转折点坐标依次输入:
        <area shape="ploy" coords="232,70,285,70,300,90,250,90,200,78" href="3.html" />
   
   (3).事件和属性:
      a.标准属性
        id, class, title, style, dir, lang, xml:lang, tabindex, accesskey
      b.事件属性
        onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup, onfocus, onblur 
   (4).注意:
      a.HTML和XHTML中的差异:
        在HTML中,<area>没有结束标签;
        在XHTML中,<area>必须正确关闭;
      b.<img>中的usemap属性可引用<map>中的id或者name属性(由浏览器决定),所以我们需要同时向<map>添加id和name属性,并且两者属性值相同;

转载于:https://my.oschina.net/u/1771585/blog/306550

你可能感兴趣的文章
Spring: IOC容器的实现
查看>>
Serverless五大优势,成本和规模不是最重要的,这点才是
查看>>
Nginx 极简入门教程!
查看>>
iOS BLE 开发小记[4] 如何实现 CoreBluetooth 后台运行模式
查看>>
Item 23 不要在代码中使用新的原生态类型(raw type)
查看>>
为网页添加留言功能
查看>>
JavaScript—数组(17)
查看>>
Android 密钥保护和 C/S 网络传输安全理论指南
查看>>
以太坊ERC20代币合约优化版
查看>>
Why I Began
查看>>
同一台电脑上Windows 7和Ubuntu 14.04的CPU温度和GPU温度对比
查看>>
js数组的操作
查看>>
springmvc Could not write content: No serializer
查看>>
Python系语言发展综述
查看>>
新手 开博
查看>>
借助开源工具高效完成Java应用的运行分析
查看>>
163 yum
查看>>
第三章:Shiro的配置——深入浅出学Shiro细粒度权限开发框架
查看>>
80后创业的经验谈(转,朴实但实用!推荐)
查看>>
让Windows图片查看器和windows资源管理器显示WebP格式
查看>>