<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[star的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/star0311</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; star0311]]></copyright><item><title><![CDATA[前端小知识之Eslint报错]]></title><link>https://blog.youkuaiyun.com/star0311/article/details/110470009</link><guid>https://blog.youkuaiyun.com/star0311/article/details/110470009</guid><author>star0311</author><pubDate>Thu, 03 Dec 2020 10:34:14 +0800</pubDate><description><![CDATA[1、Do not access Object.prototype method ‘hasOwnProperty’ from target object
错误写法：obj.hasOwnProperty(‘key’)
正确写法：Object.prototype.hasOwnProperty.call(obj, ‘key’)

]]></description><category></category></item><item><title><![CDATA[前端项目中常用的小功能]]></title><link>https://blog.youkuaiyun.com/star0311/article/details/104945869</link><guid>https://blog.youkuaiyun.com/star0311/article/details/104945869</guid><author>star0311</author><pubDate>Wed, 18 Mar 2020 15:34:06 +0800</pubDate><description><![CDATA[列举两个日期间的所有日期
举个例子：开始日期：2020-03-11    结束日期：2020-04-01， 列举中间的日期，包括两头的日期。

getDate (datestr) {
  let temp = datestr.split('-')
  if (temp[1] === '01') {
    temp[0] = parseInt(temp[0], 10) - 1
    temp[...]]></description><category></category></item><item><title><![CDATA[js实现时分秒倒计时]]></title><link>https://blog.youkuaiyun.com/star0311/article/details/103339153</link><guid>https://blog.youkuaiyun.com/star0311/article/details/103339153</guid><author>star0311</author><pubDate>Sun, 01 Dec 2019 20:40:45 +0800</pubDate><description><![CDATA[&lt;!DOCTYPE html&gt;
&lt;html lang="en"&gt;
&lt;head&gt;
    &lt;meta charset="UTF-8"&gt;
    &lt;title&gt;js时分秒毫秒倒计时&lt;/title&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;div class="active_time" id="active_t...]]></description><category></category></item><item><title><![CDATA[原生JS实现下拉加载]]></title><link>https://blog.youkuaiyun.com/star0311/article/details/102702293</link><guid>https://blog.youkuaiyun.com/star0311/article/details/102702293</guid><author>star0311</author><pubDate>Wed, 23 Oct 2019 15:42:10 +0800</pubDate><description><![CDATA[实现的原理：滚动条当前的位置+当前可视范围的高度=文档完整的高度
1、获取滚动条当前位置
// 获取滚动条当前的位置
function getScrollTop() {
    let  scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
    return scrollTop
}

2、获取当前可...]]></description><category></category></item><item><title><![CDATA[css选择器]]></title><link>https://blog.youkuaiyun.com/star0311/article/details/99408642</link><guid>https://blog.youkuaiyun.com/star0311/article/details/99408642</guid><author>star0311</author><pubDate>Tue, 13 Aug 2019 10:19:51 +0800</pubDate><description><![CDATA[1、交集选择器
既是p标签类名称又是text的字体变成红色
p.text{
color: red
}
2、并集选择器
让container下的所有元素内容为蓝色
#container p, span, em, strong{
color: blue
}
3、兄弟选择器
选择h1 元素后出现的段落
h1~p{
color:red;
}
&lt;p&gt;Hello word!&lt;/p&gt;
&...]]></description><category></category></item><item><title><![CDATA[npm run命令会自动在环境变量$PATH添加node_modules/.bin目录]]></title><link>https://blog.youkuaiyun.com/star0311/article/details/90901819</link><guid>https://blog.youkuaiyun.com/star0311/article/details/90901819</guid><author>star0311</author><pubDate>Wed, 05 Jun 2019 14:25:51 +0800</pubDate><description><![CDATA[npm run命令会自动在环境变量$PATH添加node_modules/.bin目录，所以scripts字段里面调用命令时不用加上路径，这就避免了全局安装NPM模块。
npm run如果不加任何参数，直接运行，会列出package.json里面所有可以执行的脚本命令。
npm run会创建一个Shell，执行指定的命令，并临时将node_modules/.bin加入PATH变量，这意味着本地模块...]]></description><category></category></item><item><title><![CDATA[npm --save-dev --save 的区别]]></title><link>https://blog.youkuaiyun.com/star0311/article/details/90899013</link><guid>https://blog.youkuaiyun.com/star0311/article/details/90899013</guid><author>star0311</author><pubDate>Wed, 05 Jun 2019 11:07:56 +0800</pubDate><description><![CDATA[npm install 在安装 npm 包时，有两种命令参数可以把它们的信息写入 package.json 文件
一个是
 --save || -S // 运行依赖（发布）

另一个是
–save-dev || -D //开发依赖（辅助）

区别是它们会把依赖包添加到package.json 文件
–save ： dependencies 键下，发布后还需要依赖的模块，譬如像jQuery库或者An...]]></description><category></category></item><item><title><![CDATA[H5移动端常见问题]]></title><link>https://blog.youkuaiyun.com/star0311/article/details/90514005</link><guid>https://blog.youkuaiyun.com/star0311/article/details/90514005</guid><author>star0311</author><pubDate>Fri, 24 May 2019 11:56:30 +0800</pubDate><description><![CDATA[html5调用安卓或者ios的拨号功能
html5提供了自动调用拨号的标签，只要在a标签的href中添加tel:就可以了。
如下：
&lt;a href="tel:4008106999,1034"&gt;400-810-6999 转 1034&lt;/a&gt;

拨打手机直接如下
&lt;a href="tel:15677776767"&gt;点击拨打15677776767&lt;/a&gt;
...]]></description><category></category></item><item><title><![CDATA[移动终端H5页面meta标签的设置案例]]></title><link>https://blog.youkuaiyun.com/star0311/article/details/90512187</link><guid>https://blog.youkuaiyun.com/star0311/article/details/90512187</guid><author>star0311</author><pubDate>Fri, 24 May 2019 10:34:32 +0800</pubDate><description><![CDATA[天猫
&lt;title&gt;天猫触屏版&lt;/title&gt;
&lt;meta content="text/html; charset=utf-8" http-equiv="Content-Type"&gt;
&lt;meta charset="utf-8"&gt;
&lt;meta content="width=device-width, initial-scale=1.0, maxi...]]></description><category></category></item><item><title><![CDATA[移动终端h5页面常用的meta属性]]></title><link>https://blog.youkuaiyun.com/star0311/article/details/90511848</link><guid>https://blog.youkuaiyun.com/star0311/article/details/90511848</guid><author>star0311</author><pubDate>Fri, 24 May 2019 10:19:59 +0800</pubDate><description><![CDATA[apple-mobile-web-app-capable
apple-mobile-web-app-capable是设置web应用是否以全屏模式运行
语法：
&lt;meta name="apple-mobile-web-app-capable" content="yes"&gt;

说明：如果content设置为yes，web应用会以全屏模式运行。content设置为no，表示正常显示。可以通过...]]></description><category></category></item><item><title><![CDATA[h5页面唤醒app]]></title><link>https://blog.youkuaiyun.com/star0311/article/details/90487171</link><guid>https://blog.youkuaiyun.com/star0311/article/details/90487171</guid><author>star0311</author><pubDate>Thu, 23 May 2019 20:13:20 +0800</pubDate><description><![CDATA[h5页面发送请求打开app自定义url scheme，如taobao://home（淘宝首页） 、etao://scan（一淘扫描）);
如果安装了客户端则会直接唤起，直接唤起后，之前浏览器窗口（或者扫码工具的webview）推入后台；
如果在指定的时间内客户端没有被唤起，则js重定向到app下载地址。
window.location.href = 'taobao://home'
setTimeo...]]></description><category></category></item><item><title><![CDATA[-webkit-text-size-adjust的用法]]></title><link>https://blog.youkuaiyun.com/star0311/article/details/90486922</link><guid>https://blog.youkuaiyun.com/star0311/article/details/90486922</guid><author>star0311</author><pubDate>Thu, 23 May 2019 19:58:58 +0800</pubDate><description><![CDATA[-webkit-text-size-adjust的用法如下：
1、当样式表里font-size&lt;12px时，中文版chrome浏览器里字体显示仍为12px，这时可以用 html{-webkit-text-size-adjust:none;} 或者html{-webkit-text-size-adjust:100%;}
2、-webkit-text-size-adjust放在body上会导致页...]]></description><category></category></item><item><title><![CDATA[移动端几种tab切换及实现方式]]></title><link>https://blog.youkuaiyun.com/star0311/article/details/90483853</link><guid>https://blog.youkuaiyun.com/star0311/article/details/90483853</guid><author>star0311</author><pubDate>Thu, 23 May 2019 17:00:19 +0800</pubDate><description><![CDATA[看了下 FrozenUI(QQ)、Jquery WeUI(微信)、SUI Mobile(淘宝)的tab实现方式，自己整理了一下。
1、FrozenUI
&lt;div class="wrap"&gt;
   &lt;ul class="tab border-b"&gt;
       &lt;li class="tab-item current"&gt;
           &lt;span&g...]]></description><category></category></item><item><title><![CDATA[div水平居中及div水平垂直居中的方法总结]]></title><link>https://blog.youkuaiyun.com/star0311/article/details/90483348</link><guid>https://blog.youkuaiyun.com/star0311/article/details/90483348</guid><author>star0311</author><pubDate>Thu, 23 May 2019 16:41:39 +0800</pubDate><description><![CDATA[水平居中
1、margin：auto
&lt;div class="wrap"&gt;
   &lt;div class="wrap-txt"&gt;&lt;/div&gt;
&lt;/div&gt;

.wrap{
   width: 100%;
}
.wrap-txt{
    width: 6rem;
    height: 2rem;
    background: #00FFFF;
  ...]]></description><category></category></item><item><title><![CDATA[三元表达式]]></title><link>https://blog.youkuaiyun.com/star0311/article/details/89510217</link><guid>https://blog.youkuaiyun.com/star0311/article/details/89510217</guid><author>star0311</author><pubDate>Thu, 25 Apr 2019 10:13:29 +0800</pubDate><description><![CDATA[var a = '123';
var b = (a === 'cpa' ? 'cpa' : (a === 'cps') ? 'cps' : 'flow');
console.log('b', b); // b flow


]]></description><category></category></item><item><title><![CDATA[Object.create()]]></title><link>https://blog.youkuaiyun.com/star0311/article/details/89384597</link><guid>https://blog.youkuaiyun.com/star0311/article/details/89384597</guid><author>star0311</author><pubDate>Thu, 18 Apr 2019 18:00:05 +0800</pubDate><description><![CDATA[Object.create()方法创建一个新对象，使用现有的对象来提供新创建的对象的_proto_。
const person = {
  isHuman: false,
  printIntroduction: function () {
    console.log(`My name is ${this.name}. Am I human? ${this.isHuman}`);
  }
};...]]></description><category></category></item><item><title><![CDATA[js判断一个对象是否为空]]></title><link>https://blog.youkuaiyun.com/star0311/article/details/89361213</link><guid>https://blog.youkuaiyun.com/star0311/article/details/89361213</guid><author>star0311</author><pubDate>Wed, 17 Apr 2019 17:52:58 +0800</pubDate><description><![CDATA[1、ES6新增的方法Object.keys()；
Object.keys() 方法会返回一个由一个给定对象的自身可枚举属性组成的数组，数组中属性名的排列顺序和使用 for…in 循环遍历该对象时返回的顺序一致 。
参数
要返回其枚举自身属性的对象。
返回值
一个表示给定对象的所有可枚举属性的字符串数组。
描述
Object.keys 返回一个所有元素为字符串的数组，其元素来自于从给定的object...]]></description><category></category></item><item><title><![CDATA[CSS3动画]]></title><link>https://blog.youkuaiyun.com/star0311/article/details/89206639</link><guid>https://blog.youkuaiyun.com/star0311/article/details/89206639</guid><author>star0311</author><pubDate>Thu, 11 Apr 2019 11:39:11 +0800</pubDate><description><![CDATA[1、 @keyframes规则
@keyframes规则用于创建动画，在@keyframes中规定某项css样式，就能创建由当前样式逐渐过渡为新样式的动画效果。
定义动画的方式有两种：
1）
&lt;head&gt;
		&lt;meta charset="UTF-8"&gt;
		&lt;title&gt;&lt;/title&gt;
		&lt;style type="text/css"&gt...]]></description><category></category></item><item><title><![CDATA[BFC]]></title><link>https://blog.youkuaiyun.com/star0311/article/details/89155469</link><guid>https://blog.youkuaiyun.com/star0311/article/details/89155469</guid><author>star0311</author><pubDate>Tue, 09 Apr 2019 18:03:50 +0800</pubDate><description><![CDATA[1、常见布局模式

CSS中的三种布局模型：流动模型（flow）、浮动模型（float）、层模型（layer）

2、BFC的原理

    BFC即 Block Formatting Context（块级格式化上下文），它属于上述布局模式中的流动模型。

   它是W3C CSS2.1规范中的一个概念，它是页面中的一块渲染区域，并且有一套渲染规则，它决定了其子元素将如何定位，以及...]]></description><category></category></item><item><title><![CDATA[CSS盒模型]]></title><link>https://blog.youkuaiyun.com/star0311/article/details/88998015</link><guid>https://blog.youkuaiyun.com/star0311/article/details/88998015</guid><author>star0311</author><pubDate>Tue, 09 Apr 2019 17:05:32 +0800</pubDate><description><![CDATA[基本概念

盒模型由里向外是content，padding，border，margin

盒模型有两种：标准模型和IE模型

标准模型：盒模型的宽高是内容（content）的宽高

IE模型：盒模型的宽高是内容（content）+填充（padding）+边框（border）的总宽高

CSS如何设置两种模型

css3的属性box-sizing

标准模型 box-sizing：content-...]]></description><category></category></item></channel></rss>