some small knowledge

cookie 增查javascript

<!--1.语义化标签的做用-->
<!--1.1 从开发角度考虑是提升代码的可读性可维护性-->
<!--1.2 网站的发布者:seo 搜索引擎优化 -->

<!--2.语义化标签的兼容问题-->
<!--2.1 IE9如下不支持H5标签(大部分css3属性,一些H5的api)-->
<!--2.2 IE9如下不认识,把这些标签当作行内元素去看待-->
<!--2.3 语义化标签须要动态建立 document.createElement('header') 同时设置块级元素-->
<!--2.4 有一款插件能帮你完成这件事件  html5shiv.js   -->
<!--2.5 必须引入在头部,在页面结构以前,提早解析h5标签-->
<!--2.6 优化处理:支持H5标签的不须要加载,IE9如下不支持H5加载-->
<!--2.7 js判断客户的浏览器版本能够作到,可是不能作到js提早加载-->
<!--2.8 条件注释:网页的任何地方  根据浏览器版本去加载内容(html标签)-->
<!--2.9 固定语法  lt 小于  gt 大于  lte 小于等于  gte 大于等于 -->

条件注释

<!--[if lte IE 8]>
<script src="html5shiv.min.js"></script>
<![endif]-->php

 

 

H5 知识

H5 api
1. querySelector() 获取符合选择器的第一个元素
2. querySelectorAll() 获取符合选择器的全部元素css

1. jquery操做类的方法:addClass() removeClass() toggleClass() hasClass()
2. h5也有相似的api 基于一个对象classList的方法 add() remove() toggle() contains()     //contains判断有误类,返回布尔值

eg:
<script>
    var dom = document.querySelector('li:nth-child(2)');
    /*1.获取类*/
    console.log(dom.classList);
    /* DOM.classList  获取的是这个DOM元素上的全部class */
    /*2.操做类*/
    dom.classList.add('blue');
    dom.classList.remove('red');

    document.querySelector('button').onclick = function () {
        dom.classList.toggle('toggle');
        console.log(dom.classList.contains('red'));
    }
</script>

H5自定义属性 : date-*
H5的date-*属性: 更改的是DOM
  var div= document.querySelector('div') //获取
  div.dateset //获取元素的全部date 对象
  div.dateset.user //获取单个

jQuery的date-*属性 : 更改的是内存(对象存储的位置内存,并不修改DOM)
$('div').date() //获取全部date属性
$('div').date('user')    // 获取单个
$('div').date('user','16')  //设置属性值
 

 

<meta http-equiv="refresh" content="0; url=">    404重定向
页面按期刷新,若是加url的,则会从新定向到指定的网页,content后面跟的是时间(单位秒),把这句话加到指定网页的<head></head>

 分享到Facebook links yotubehtml

  <div class=fx><a class=fb href="javascript:window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent(document.location.href)+'&t='+encodeURIComponent(document.title),'_blank','toolbar=yes, location=yes, directories=no, status=no, menubar=yes, scrollbars=yes, resizable=no, copyhistory=yes, width=600, height=450,top=100,left=350');void(0)"></a>
            <a class=ytb href=#></a> <a class=tw href="javascript:window.open('http://twitter.com/home?status='+encodeURIComponent(document.location.href)+' '+encodeURIComponent(document.title),'_blank','toolbar=yes, location=yes, directories=no, status=no, menubar=yes, scrollbars=yes, resizable=no, copyhistory=yes, width=600, height=450,top=100,left=350');void(0)"></a>
            <a class=in href="javascript:window.open('http://www.linkedin.com/shareArticle?mini=true&url='+encodeURIComponent(document.location.href)+'&title='+encodeURIComponent(document.title)+'&source='+encodeURIComponent(document.location.href),'_blank','toolbar=yes, location=yes, directories=no, status=no, menubar=yes, scrollbars=yes, resizable=no, copyhistory=yes, width=600, height=450,top=100,left=350');void(0)"></a>
        </div>

 

JsFormat:html5

这里下载这插件包 https://github.com/jdc0589/JsFormat ,点油下角的zip就能下载java

使用方法:jquery

一、快捷键:ctrl+alt+fcss3

 

html-css-js prettify:git

一、快捷键:ctrl+shift+Pgithub

三、输入html-css-js prettify,选择html-css-js prettify

 

  https://chenhuichao.com/    陈回潮的学习博客

//安装ruby 配置sass 环境

移除以前的环境,使用国内镜像
gem sources --add https://gems.ruby-china.com/ --remove https://rubygems.org/

//安装完成以后,查看源
gem sources -l

//提示以下

*** CURRENT SOURCES ***

https://gems.ruby-china.com/

gem install sass


编译参数:--no-cache %FileName% %FileBaseName%.css --style compact
参考连接:https://gems.ruby-china.com/

 

滚动到页头
<script>

        $(window).scroll(function(){
      $("#scrolls").click(function(){
            $("html, body").animate({scrollTop:0 },300);
        })
    });
    </script>

 

监听span里面text 文本的变化触发事件
$("#select2-chosen-6").bind("DOMNodeInserted",function(e){ console.log($(e.target).html()); })

 jquery : stickUp

 

#获取访问用户的IP地址
<script src="http://pv.sohu.com/cityjson?ie=utf-8"></script> 

      document.write(returnCitySN["cip"]+','+returnCitySN["cname"])

 

 $.ajax({

             type: "POST",

             url: "test.json",

             data: {ip:'168.122.122.12'},

             dataType: "json",

             success: function(data){

            }

         });

 

请求轮询:数据实时更新——每隔xx秒须要刷新一次接口——即须要用到定时器相关原理,只使用setInterval 会形成定时器叠加,致页面卡死
window.setInterval(() => { setTimeout(fun, 0) }, 30000)

 

//点击遮罩层隐藏,解决方案是即是判断event target ,而且保证 这个时间不会冒泡。
$('.overlay').click(function(e){ if (e.target == e.currentTarget) closeOverlay(); });

 

cookie小记
//判断cookie是否存在
getCookie(name)      
        {
            var arr = document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)"));
            if(arr != null) {
                this.options=JSON.parse(arr[2])
            }else{
                this.getScreen()
            }
        }

//设置增长cookie   params: exdays(定时过时)
设置定cookie 为数组内含对象时须要转换为字符串 eg: var data=[{a:1},{a:2}]
JSON.stringify(data)

setCookie(c_name,exdays) { var exdate = new Date(); exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays); window.document.cookie = "secondCategory" + "=" + c_name + ";path=/;expires=" + exdate.toGMTString(); }

 

修改滚动条样式
/*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/  
::-webkit-scrollbar  
{  
    width: 4px;  /*滚动条宽度*/
    height: 10px;  /*滚动条高度*/
}  
  
/*定义滚动条轨道 内阴影+圆角*/  
::-webkit-scrollbar-track  
{  
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);  
    border-radius: 10px;  /*滚动条的背景区域的圆角*/
    background-color: #eee;/*滚动条的背景颜色*/  
}  
  
/*定义滑块 内阴影+圆角*/  
::-webkit-scrollbar-thumb  
{  
    border-radius: 10px;  /*滚动条的圆角*/
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);  
    background-color: #999;  /*滚动条的背景颜色*/
}  

 

// 对象深度克隆方法
export function cloneObj(obj) {
  let str;
  let newobj = obj.constructor === Array ? [] : {};
  if (typeof obj !== 'object') {
    return;
  } else if (window.JSON) {
    str = JSON.stringify(obj); // 序列化对象
    newobj = JSON.parse(str); // 还原
  } else {
    // 若是不支持以上方法
    for (const i in obj) {
      if ({}.hasOwnProperty.call(obj, i)) {
        newobj[i] = typeof obj[i] === 'object' ? cloneObj(obj[i]) : obj[i];
      }
    }
  }
  return newobj;
}

 邮箱校验:
REGEX_EMAIL = "^([a-z0-9A-Z]+[-|\\.]?)+[a-z0-9A-Z]@([a-z0-9A-Z]+(-[a-z0-9A-Z]+)?\\.)+[a-zA-Z]{2,}$"

 

当前分支是maser分支,我想将stable分支上的代码彻底覆盖brush分支,首先切换到brush分支。

git reset --hard origin/stable

检查元素是否在视窗内

相关文章
相关标签/搜索