前端开发笔记

aria-expanded="false"

• aria-expanded表示展开状态。默认为undefined, 表示当前展开状态未知。其它可选值：true表示元素是展开的；false表示元素不是展开的

aria-hidden字符串

• 可选值为true和false，true表示元素隐藏(不可见)，false表示元素可见

快捷键

• Ctrl + Enter 光标不在末尾回车
• Ctrl + Backspace 删除一个词
• Ctrl + -> 以词为单位后移

col-xs-n中放图片不生效

img {
  display: block;
  max-width: 100%;
}

display

• block 默认，此元素将显示为块级元素，此元素前后会带有换行符
• inline 此元素会被显示为内联元素，元素前后没有换行符
• inline-block 行内块元素

使用col就要在母元素上清除浮动，因为col栅格也是浮动的

使用flag覆盖叠加新的属性

• css中使用.side-bar-card.flag {}来调用
• html中用

a标签链接不带下划线，并列换行写

a,
a:hover,
a:visited,
a:link,
a:active {
  text-decoration: none;
}

line-heigh不要写px

表格居中

bootstrap响应式表格

表格内容水平垂直居中

图片撑满
background-size: cover;
input/select/textarea/... + .form-control
.form-group
 
  
单独的表单控件会被自动赋予一些全局样式。所有设置了.form-control类的、和<select></code>元素都将被默认设置宽度属性为<code>width: 100%;</code>。将<code>label</code>元素和前面提到的控件包裹在<code>.form-group</code>中可以获得最好的排列</li> 
 </ul> 
 <h1>响应式表格</h1> 
 <ul> 
  <li>将任何<code>.table</code>元素包裹在<code><div class="table-responsive"></code>元素内</li> 
 </ul> 
 <h1>垂直方向的内容截断</h1> 
 <ul> 
  <li>响应式表格使用了<code>overflow-y: hidden</code>属性，这样就能将超出表格底部和顶部的内容截断。特别是，也可以截断下拉菜单和其他第三方组件</li> 
 </ul> 
 <h1>.form-inline</h1> 
 <ul> 
  <li>输入框和单选/多选框控件默认被设置为<code>width: 100%;</code>。在内联表单，我们将这些元素的宽度设置为<code>width: auto;</code>，因此，多个控件可以排列在同一行。根据布局需求，手动设置宽度</li> 
  <li>一定要添加<code>label</code>标签，对于内联表单，可以通过为<code>label</code>设置<code>.sr-only</code>类将其隐藏。还有一些辅助技术提供<code>label</code>标签的替代方案，比如<code>aria-label、aria-labelledby</code>或<code>title</code>属性</li> 
 </ul> 
 <h1>.form-horizontal</h1> 
 <ul> 
  <li>无需再添加<code>.row</code>了</li> 
 </ul> 
 <h1>margin对span无效</h1> 
 <pre><code class="css">display: block;
line-height: 1.5;
</code></pre> 
 <h1>button后退</h1> 
 <pre><code class="html"><button class="btn btn-danger ycx" onclick="javascript :history.back(-1);">返回</button>
</code></pre> 
 <h1>居中</h1> 
 <ul> 
  <li>文本内容居中：<code>text-center</code> </li> 
  <li>图片居中：<code>center-block</code> </li> 
  <li>其他类型元素居中：<code>col-md-offset-X</code> </li> 
 </ul> 
 <h1>在form标签上加novalidate属性，可以禁用h5默认的表单验证效果</h1> 
 <h1> <code>div</code>置顶的方法</h1> 
 <pre><code class="css">position: relative;
z-index: 99999;
</code></pre> 
 <h1>margin:auto实现绝对定位元素的居中</h1> 
 <pre><code class="css">.element {
  width: 600px;
  height: 400px;
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}
</code></pre> 
 <h1>ajax中dataType为预期服务器返回的数据类型，不写有默认值，开发过程中不要写</h1> 
 <p>服务器只返回单个<code>String</code>类型数据，则一定要写<code>dataType: 'text'</code></p> 
 <h1>ajax表单序列化传输</h1> 
 <pre><code class="javascript">$("#submit").on('touchstart', function () {
  var form = $("#handouts").serialize();
  $.ajax({
    url: 'http://192.168.1.111:8686/EAnnotation/addPassage',
    type: "post",
    data: form,
    cache: false,
    success: function (data) {
      window.location.href = "course.html"
    },
    error: function (e) {
    }
  })
  return false;
 });
</code></pre> 
 <h1>ajax表单传递键值对</h1> 
 <pre><code class="javascript">$.ajax({
  url: ip + "/scm",
  type: 'POST',
  cache: false,
  data: {
     username: username,
     password: password
  },
  success: function (data) {
    console.log(1)
    if (data == 0) {
      alert("密码错误");
    } else if (data == -1) {
      alert("账号不存在")
    } else {
      console.log(data)
      // window.location.href = "index.html"
      localStorage.name = data;
    }
  },
  error: function (e) {
  }
})
</code></pre> 
 <h1>ajax传递formData</h1> 
 <p>formData既可以传键值对，也可以传文件</p> 
 <pre><code class="javascript">$("#submit").on('touchstart', function () {
  var form = new FormData($('#homework')[0]);
  $.ajax({
    url: 'https://bitcandy.one/EAnnotation/addPassage',
    type: 'POST',
    cache: false,
    data: form,
    processData: false,
    contentType: false,
    success: function (data) {
      window.location.href = "classteacher.html"
      console.log(form);
    },
    error: function (e) { }
  })
  return false;
});
</code></pre> 
 <h1>ajax拿到json后如何使用</h1> 
 <pre><code class="javascript">$.ajax({
  url: 'http://192.168.1.111:8686/EAnnotation/getAllPassages',
  type: "post",
  cache: false,
  success: function (data) {
    console.log(data);
    $.each(data, function (i, item) {
      var time = getDateDiff(item.releaseTime);
      if (item.photo) {

      } else {
        $("ul[class=index]").append(
          `<div class="card">
            <div class="card-header">` + item.title + `</div>
            <div class="card-content card-content-padding">
              <p class="date index">` + item.theme + `·` + time + `</p>
              <a href="www.baidu.com" class="link" style="color: black"><p style="margin-top: 0; margin-bottom: 0;">` + getcontent(item.content).substring(0, 70) + ` ...</p></a>
            </div>
            <div class="card-footer">
              <a href="#" class="link" style="color">
                <i class="f7-icons size-18">heart_fill</i>` + 1 + `喜欢</a>
              <a href="#" class="link">
                ` + 22 + `人批注过，共计` + 44 + `条批注
                  </a>
            </div>
          </div>`
        )
      }
    })

  },
  error: function (e) {
  }
 })

</code></pre> 
 <h1>多行文字限制字数显示...</h1> 
 <pre><code class="css">.text_overflow{
  /* width:27rem; */
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
</code></pre> 
 <h1>单行文字限制字数显示...</h1> 
 <pre><code class="css">.text_overflow{
  width:27em;
  white-space:nowrap;
  text-overflow:ellipsis;
  -o-text-overflow:ellipsis; 
  overflow:hidden;
}
</code></pre> 
 <h1>从html代码中获取纯文本函数</h1> 
 <pre><code class="javascript">function getcontent(text) {
  var html = text;
  return html.replace(/<[^>]*>|/g, "");
}
</code></pre> 
 <h1>时间戳转化函数</h1> 
 <pre><code class="javascript">// 2014-05-08 00:22:11
function getDateDiff(dateTimeStamp) {
  var dateTimeStamp = new Date(Date.parse(dateTimeStamp.replace(/-/g, "/")));
  dateTimeStamp = dateTimeStamp.getTime();
  var result;
  var minute = 1000 * 60;
  var hour = minute * 60;
  var day = hour * 24;
  var halfamonth = day * 15;
  var month = day * 30;
  var now = new Date().getTime();
  var diffValue = now - dateTimeStamp;
  if (diffValue < 0) {
    return;
  }
  var monthC = diffValue / month;
  var weekC = diffValue / (7 * day);
  var dayC = diffValue / day;
  var hourC = diffValue / hour;
  var minC = diffValue / minute;
  if (monthC >= 1) {
    if (monthC <= 12)
      result = "" + parseInt(monthC) + "个月前";
    else {
      result = "" + parseInt(monthC / 12) + "年前";
    }
  }
  else if (weekC >= 1) {
    result = "" + parseInt(weekC) + "周前";
  }
  else if (dayC >= 1) {
    result = "" + parseInt(dayC) + "天前";
  }
  else if (hourC >= 1) {
    result = "" + parseInt(hourC) + "小时前";
  }
  else if (minC >= 1) {
    result = "" + parseInt(minC) + "分钟前";
  } else {
    result = "刚刚";
  }
  return result;
};
</code></pre> 
 <h1>js变量生命周期</h1> 
 <ul> 
  <li>全局变量</li> 
 </ul> 
 <pre><code class="javascript">var n=999;
function f1(){
  alert(n);
}
f1(); // 输出999,说明全局变量n在函数内部被读取
</code></pre> 
 <ul> 
  <li>函数中的全局变量：在函数内部声明变量没有使用<code>var</code>，实际上是声明了一个全局变量，前提是需要先调用函数</li> 
 </ul> 
 <pre><code class="javascript">var func1 = function(){
  a1 = 1;
  console.log(a1); //输出:1
  function func2() {//func2()是一个闭包
    a2 = 2;
    console.log(a2);
  }
  func2()；//闭包函数中的变量在调用函数之后，变量也是全局变量
  console.log(a2);//输出2
};
func1();//调用函数，才会使变量生效
console.log(a1);//输出1
console.log(a2);//输出2，说明闭包中没有用var声明的变量也是全局变量。
</code></pre> 
 <ul> 
  <li>局部变量：在函数内部声明的变量。函数内部的变量，外部无法读取。</li> 
 </ul> 
 <pre><code class="javascript">function f1(){
  var n=999;
}
alert(n); // 没有定义，说明函数内部的变量，外部无法读取。
</code></pre> 
 <ul> 
  <li> <code>JavaScript</code>解释器在执行脚本时，是按块来执行的。通俗地说，就是浏览器在解析<code>HTML</code>文档流时，如果遇到一个<code><script></code>标签，则<code>JavaScript</code>解释器会等到这个代码块都加载完后，先对代码块进行预编译，然后再执行。执行完毕后，浏览器会继续解析下面的<code>HTML</code>文档流，同时<code>JavaScript</code>解释器也准备好处理下一个代码块。由于<code>JavaScript</code>是按块执行的，所以如果在一个<code>JavaScript</code>块中调用后面块中声明的变量或函数就会提示语法错误。虽然说，<code>JavaScript</code>是按块执行的，但是不同块都属于同一个全局作用域，也就是说，<strong>块之间的变量和函数是可以共享的</strong>。</li> 
 </ul> 
 <h1>jquery获取radio被选中的值</h1> 
 <blockquote> 
  <p>三种方法都可以</p> 
 </blockquote> 
 <pre><code class="javascript">$('input:radio:checked').val()；
$("input[type='radio']:checked").val();
$("input[name='rd']:checked").val();
</code></pre> 
 <h1>jquery获取select被选中的值</h1> 
 <ul> 
  <li>获取选中项的<code>value</code>值</li> 
 </ul> 
 <pre><code class="javascript">$('select#sel option:selected').val();
或者
$('select#sel').find('option:selected').val();
</code></pre> 
 <ul> 
  <li>获取选中项的<code>text</code>值</li> 
 </ul> 
 <pre><code class="javascript">$('select#seloption:selected').text();
或者
$('select#sel').find('option:selected').text();
</code></pre> 
 <ul> 
  <li>获取当前选中项的索引值</li> 
 </ul> 
 <pre><code class="javascript">$('select#sel').get(0).selectedIndex;
</code></pre> 
 <h1>jquery获取checkbox被选中的值</h1> 
 <ul> 
  <li>获取单个<code>checkbox</code>选中项</li> 
 </ul> 
 <pre><code class="javascript">$("input:checkbox:checked").val() 
或者 
$("input:[type='checkbox']:checked").val(); 
或者 
$("input:[name='ck']:checked").val(); 
</code></pre> 
 <ul> 
  <li>获取多个<code>checkbox</code>选中项</li> 
 </ul> 
 <pre><code class="javascript">$("input[name='favour']:checked").each(function () {
  alert($(this).val());
});
</code></pre> 
 <h1>jquery获取span和input的值</h1> 
 <pre><code class="javascript">$("span").html();
$("input").val();
</code></pre> 
 <h1>jquery数组对象获取value值</h1> 
 <ul> 
  <li>需将数组对象再次封装为<code>jquery</code>对象</li> 
 </ul> 
 <pre><code class="javascript">// 错误
$("input[name='jQueryArray']")[0].val();
// 正确
$($("input[name='jQueryArray']")[0]).val();0
</code></pre> 
 <h1>this必须用$包装成JQuery对象才能使用</h1> 
 <h1>用let和const的声明可以产生块级作用域，解决闭包循环事件绑定</h1> 
 <pre><code class="javascript">for (var i = 0; i < 2; i++)  
{     
  let ii = i;   //const也可以，块级作用域  
  var bt = document.getElementById('bt'+ii);  
  bt.onclick = function(){  
    console.log(ii);  
  };  
}  
</code></pre> 
 <h1>JavaScript中有5种简单数据类型（也称为基本数据类型）： Undefined、Null、Boolean、Number和String 。还有1种复杂数据类型—— Object ，Object本质上是由一组无序的名值对组成的。</h1> 
 <h1>backgroundColor要加.style属性设置元素的背景颜色；bgcolor不用加.style</h1> 
 <h1>json中key也是个字符串，要加引号，key和value之间是用:号来表示的</h1> 
 <h1>CSS样式表和选择器</h1> 
 <ul> 
  <li>CSS和HTML结合的三种方式：行内样式表、内嵌样式表、外部样式表</li> 
  <li>CSS四种基本选择器：标签选择器、类选择器、ID选择器、通用选择器</li> 
  <li>CSS几种扩展选择器：后代选择器、交集选择器、并集选择器、伪类选择器</li> 
 </ul> 
</article>
                            </div>
                        </div>
                    </div>
                    <!--PC和WAP自适应版-->
                    <div id="SOHUCS" sid="1757161065805791232"></div>
                    <script type="text/javascript" src="/views/front/js/chanyan.js"></script>
                    <!-- 文章页-底部 动态广告位 -->
                    <div class="youdao-fixed-ad" id="detail_ad_bottom"></div>
                </div>
                <div class="col-md-3">
                    <div class="row" id="ad">
                        <!-- 文章页-右侧1 动态广告位 -->
                        <div id="right-1" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad">
                            <div class="youdao-fixed-ad" id="detail_ad_1"> </div>
                        </div>
                        <!-- 文章页-右侧2 动态广告位 -->
                        <div id="right-2" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad">
                            <div class="youdao-fixed-ad" id="detail_ad_2"></div>
                        </div>
                        <!-- 文章页-右侧3 动态广告位 -->
                        <div id="right-3" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad">
                            <div class="youdao-fixed-ad" id="detail_ad_3"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="container">
        <h4 class="pt20 mb15 mt0 border-top">你可能感兴趣的:(前端开发笔记)</h4>
        <div id="paradigm-article-related">
            <div class="recommend-post mb30">
                <ul class="widget-links">
                    <li><a href="/article/1705149951610269696.htm"
                           title="前端开发笔记之three.js基本语法" target="_blank">前端开发笔记之three.js基本语法</a>
                        <span class="text-muted">往事随风，唯有技术</span>
<a class="tag" taget="_blank" href="/search/js/1.htm">js</a><a class="tag" taget="_blank" href="/search/%E7%AC%94%E8%AE%B0/1.htm">笔记</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a>
                        <div>1.引入three.js//原生写法，需要在官网先下载three.js文件包，然后在HTML文件中配置引入{"imports":{"three":"../../three.js/build/three.module.js","three/addons/":"../../three.js/examples/jsm/"}}//vue或react引入three插件npminstallthree--sav</div>
                    </li>
                    <li><a href="/article/1701628733024186368.htm"
                           title="前端开发笔记" target="_blank">前端开发笔记</a>
                        <span class="text-muted">风间灵佑</span>

                        <div>数组对象去重在一个对象数组中，找出某一个对象在数组中的位置，直接使用indexOf不好使，因为对象是引用值，即使形状都一样，也是不相等的，因为他们引用的是不同的地址。需要使用JSON.stringify()进行转换之后作比较就可以了。聊天界面时间段的区分聊天的时间段拆分，五分钟之内发的消息放在一起，聊天只需要第一条展示时间，其他不用每次都拿后面一个与前面一个作比较，找到某一个比较大于规定的值，则给</div>
                    </li>
                    <li><a href="/article/1698281269084893184.htm"
                           title="Web前端开发笔记48——jQuery概述" target="_blank">Web前端开发笔记48——jQuery概述</a>
                        <span class="text-muted">言行物恒</span>
<a class="tag" taget="_blank" href="/search/%23Web%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91%E5%85%A5%E9%97%A8/1.htm">#Web前端开发入门</a><a class="tag" taget="_blank" href="/search/jquery/1.htm">jquery</a>
                        <div>1.JS库的概念：仓库：可以把很多东西放到这个仓库里面。找东西只需要到仓库里面查找到就可以了。常见的JS库：2.jQuery的概念：jQuery出现的目的就是加快前端人员的开发速度，我们可以非常方便的调用和使用它，从而提高开发效率。3.jQuery的优点：</div>
                    </li>
                    <li><a href="/article/1698281269563043840.htm"
                           title="Web前端开发笔记49——jQuery入门" target="_blank">Web前端开发笔记49——jQuery入门</a>
                        <span class="text-muted">言行物恒</span>
<a class="tag" taget="_blank" href="/search/%23Web%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91%E5%85%A5%E9%97%A8/1.htm">#Web前端开发入门</a><a class="tag" taget="_blank" href="/search/jquery/1.htm">jquery</a>
                        <div>1.页面加载完毕使用jQuery的两种办法：2.‘$’的意思：jquery的顶级对象$.其实它的表示的就是：jQuery。由上可知，$和jQuery的意义是相同的。3.jquery对象和DOM对象：jquery对象和DOM对象的相互转换：</div>
                    </li>
                    <li><a href="/article/1697250477445558272.htm"
                           title="Web前端开发笔记(6)" target="_blank">Web前端开发笔记(6)</a>
                        <span class="text-muted">蒜蓉酱油</span>
<a class="tag" taget="_blank" href="/search/Web%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91%E7%AC%94%E8%AE%B0/1.htm">Web前端开发笔记</a><a class="tag" taget="_blank" href="/search/html5/1.htm">html5</a><a class="tag" taget="_blank" href="/search/css3/1.htm">css3</a><a class="tag" taget="_blank" href="/search/visual/1.htm">visual</a><a class="tag" taget="_blank" href="/search/studio/1.htm">studio</a><a class="tag" taget="_blank" href="/search/code/1.htm">code</a><a class="tag" taget="_blank" href="/search/web/1.htm">web</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a>
                        <div>Web前端开发笔记(6)HTML5和CSS3提高文章目录Web前端开发笔记(6)前言基础学习路线目标：HTML5的新特性1.HTML5的新特性1.1HTML5新增的语义化标签1.2HTML5新增的多媒体标签1.2.1视频``1.2.2音频``1.2.3多媒体标签总结1.3HTML5新增的input类型1.4HTML5新增的表单属性2.CSS3的新特性2.1CSS3的现状2.2属性选择器2.3结构伪</div>
                    </li>
                    <li><a href="/article/1694178470868889600.htm"
                           title="Web前端开发笔记之CSS拓展02——垂直对齐属性、光标类型、溢出部分显示效果、元素整体透明效果" target="_blank">Web前端开发笔记之CSS拓展02——垂直对齐属性、光标类型、溢出部分显示效果、元素整体透明效果</a>
                        <span class="text-muted">言行物恒</span>
<a class="tag" taget="_blank" href="/search/%23/1.htm">#</a><a class="tag" taget="_blank" href="/search/Web%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91%E2%80%94%E2%80%94CSS%E6%8B%93%E5%B1%95/1.htm">Web前端开发——CSS拓展</a><a class="tag" taget="_blank" href="/search/css3/1.htm">css3</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a>
                        <div>1.垂直对齐属性问题引入：当我们使用大图片配合小标签或小文字的时候，会出现扭曲不对齐的情况。这里我们需要知道一个概念就是文字使用自己的基线的。垂直对齐方式：浏览器在读取代码时，默认把行内块和行内标签当作文字处理，默认基线对齐。根据上面的经验，我们知道行内块和行内标签作文字处理，那么我们同样可以使用一些处理文字的标签来定义我们的行内和行内块元素，比如text-align不光可以用于单独的文字，我们可</div>
                    </li>
                    <li><a href="/article/1671471951161417728.htm"
                           title="前端开发笔记 ｜ React Hooks子组件和父组件交互" target="_blank">前端开发笔记 ｜ React Hooks子组件和父组件交互</a>
                        <span class="text-muted">LTing5505</span>
<a class="tag" taget="_blank" href="/search/react.js/1.htm">react.js</a><a class="tag" taget="_blank" href="/search/%E7%AC%94%E8%AE%B0/1.htm">笔记</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a>
                        <div>前端开发框架目前比较常用的就是react、vue等，其中使用ReactHooks带来了不少的好处，今天来聊聊ReactHooks开发方式下，子组件和父组件的交互。父组件调用子组件子组件定义importReactfrom"react";typeProps={btnText:string;onClick:()=>void;};constSub=(props:Props)=>{const{btnText</div>
                    </li>
                    <li><a href="/article/1671471695493423104.htm"
                           title="前端开发笔记 ｜ Vue 3 子组件和父组件交互" target="_blank">前端开发笔记 ｜ Vue 3 子组件和父组件交互</a>
                        <span class="text-muted">LTing5505</span>
<a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/%E7%AC%94%E8%AE%B0/1.htm">笔记</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a>
                        <div>在上一篇文章《前端开发笔记｜ReactHooks子组件和父组件交互》里面我介绍了在使用ReactHooks的开发方式下，子组件和父组件的交互，那现在就来介绍下Vue3中的子组件和父组件的交互。父组件调用子组件子组件定义文件SubItem.vueexportdefault{props:{btnText:String}}父组件调用子组件父组件调用子组件importSubItemfrom'../comp</div>
                    </li>
                    <li><a href="/article/1643419420862767104.htm"
                           title="小白前端开发笔记-创建网站的细节（娃娃级）导航栏的写法细则 搜索框的写法细则" target="_blank">小白前端开发笔记-创建网站的细节（娃娃级）导航栏的写法细则 搜索框的写法细则</a>
                        <span class="text-muted">火腿肠烧烤大赛冠军</span>
<a class="tag" taget="_blank" href="/search/%E5%B0%8F%E7%99%BD%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91%E7%AC%94%E8%AE%B0/1.htm">小白前端开发笔记</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a>
                        <div>拿到后的操作：观看布局确定版心：1102px基础准备：*{margin:0px;padding:0px;line-height:1;}.center{width:1100px;margin:0pxauto;}li{list-style-type:none;}a{text-decoration:none;}针对form的操作：.head_centerform{width:294px;（不包含边框的高</div>
                    </li>
                    <li><a href="/article/1462567336891416576.htm"
                           title="Web前端开发笔记——第四章 JavaScript程序设计 第三节 数据类型" target="_blank">Web前端开发笔记——第四章 JavaScript程序设计 第三节 数据类型</a>
                        <span class="text-muted">晚风(●•σ )</span>
<a class="tag" taget="_blank" href="/search/Web%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91/1.htm">Web前端开发</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a>
                        <div>目录一、基本数据类型（一）String类型（二）Number类型1、字面量2、无穷大3、非数值（三）Boollean类型（四）Undefined类型和Null类型二、引用数据类型（一）Object类型（二）数组类型（三）RegExp类型（四）Function类型三、查看变量数据类型一、基本数据类型JavaScript中包括两种不同数据类型，分为基本数据类型和引用数据类型，前者指简单的数据段，后者指</div>
                    </li>
                    <li><a href="/article/1462567336077721600.htm"
                           title="Web前端开发笔记——第四章 JavaScript程序设计 第二节 变量" target="_blank">Web前端开发笔记——第四章 JavaScript程序设计 第二节 变量</a>
                        <span class="text-muted">晚风(●•σ )</span>
<a class="tag" taget="_blank" href="/search/Web%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91/1.htm">Web前端开发</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a>
                        <div>目录一、JavaScript中的注释二、变量的命名规则三、变量声明以及赋值四、变量作用域五、变量提升一、JavaScript中的注释JavaScript中单行注释通过“//”，多行注释通过“/*”开头并以“*/”结尾。二、变量的命名规则JavaScript中命名变量必须以字母开头（也能以$或_符号开头），且变量名不能包含空格和标点符号，另外变量里不能是关键字、保留字作为变量名。例如：vardefa</div>
                    </li>
                    <li><a href="/article/1391795901265170432.htm"
                           title="Web前端开发笔记46——动画原理、缓动效果、页面返回特定位置" target="_blank">Web前端开发笔记46——动画原理、缓动效果、页面返回特定位置</a>
                        <span class="text-muted">Dev SunShine</span>
<a class="tag" taget="_blank" href="/search/Web%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91/1.htm">Web前端开发</a><a class="tag" taget="_blank" href="/search/js/1.htm">js</a>
                        <div>1.动画原理：最核心的原理，通过定时器（setInterval）不断移动盒子位置。2.动画在制作的时候，要对对象施加position参数，不然元素对象是不会动的。3.我们对不同的对象设置不同的timer可以使用‘obj.元素’的方式来声明timer，这样每个元素都有属于自己的timer了。4.上面的代码有一个bug，就是在多次触发的情况下timer会多次叠加，这个时候我们就要用到clearInte</div>
                    </li>
                    <li><a href="/article/1391800235445014528.htm"
                           title="Web前端开发笔记——HTML和CSS" target="_blank">Web前端开发笔记——HTML和CSS</a>
                        <span class="text-muted">南一师兄</span>
<a class="tag" taget="_blank" href="/search/%E7%AC%94%E8%AE%B0/1.htm">笔记</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a>
                        <div>文章目录一、HTML基础笔记1、基础概念：标签、元素、属性、文件结构1.1标签1.2元素1.3属性1.4文件结构2、标签2.1标题：h1~h62.2段落：p2.3段内换行：br2.4空格字符:``2.5预留格式：pre2.6行内组合：span2.7水平线：hr2.8注释2.9超链接：a2.10插入图像：img标签2.11脚标标签：sup，sub2.12区域：div2.13无序列表：ulli2.14</div>
                    </li>
                    <li><a href="/article/1353988712475734016.htm"
                           title="前端开发笔记注意点" target="_blank">前端开发笔记注意点</a>
                        <span class="text-muted">大铭昕</span>
<a class="tag" taget="_blank" href="/search/web%E5%89%8D%E7%AB%AF/1.htm">web前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/html%2Bcss/1.htm">html+css</a>
                        <div>前端开发笔记注意点JSJS一条语句中声明的多个变量不可以同时赋同一个值:varx,y,z=1;x,y为undefined，z为1重新声明JavaScript变量,变量的值不会丢失：在以下两条语句执行后，变量carname的值依然是“Volvo”：varcarname=“Volvo”;varcarname;JS动态类型：相同的变量可用作不同的类型varx;//x为undefinedvarx=5;//</div>
                    </li>
                    <li><a href="/article/1305776949167165440.htm"
                           title="前端开发笔记4-总结一周中遇到的问题及解决方法" target="_blank">前端开发笔记4-总结一周中遇到的问题及解决方法</a>
                        <span class="text-muted">昨夜是今晨的开始</span>
<a class="tag" taget="_blank" href="/search/web/1.htm">web</a>
                        <div>1.echartsCandlestick关键字的坑Candlestick是绘制k线图的关键字，最近一直再做k线图相关的需求，分享给大家我遇到的坑，有遇到过的同学可以留言讨论哟。先上图selected是控制data栏目数据显示的关键字，但是有一个特殊情况，当selected隐藏类型为candlestick，设置为false会报错：传入数据不能为空，报错位置在echarts源码23600多行。由于我的</div>
                    </li>
                    <li><a href="/article/1304694917636853760.htm"
                           title="[ios前端开发笔记]使用scrollView进行分页" target="_blank">[ios前端开发笔记]使用scrollView进行分页</a>
                        <span class="text-muted">HeroKingsley</span>
<a class="tag" taget="_blank" href="/search/ios%E5%BC%80%E5%8F%91%E7%AC%94%E8%AE%B0/1.htm">ios开发笔记</a>
                        <div>本篇教程内的工程资源可以在下面这个地址下载，欢迎转载，谢谢。http://download.csdn.net/detail/ez_wzr/6364991使用场景举例：应用使用指南，使用ios里的scrollview来实现分页功能，通过如下方法一个普遍性的指南只要几分钟就能批量生产啦。实现的核心技术细节：scrollview的pagingEnabled属性，将其设置为YES，并设置其contentS</div>
                    </li>
                    <li><a href="/article/1294105630843412480.htm"
                           title="Web前端开发笔记--JavaScript课堂笔记及练习" target="_blank">Web前端开发笔记--JavaScript课堂笔记及练习</a>
                        <span class="text-muted">oqqYaZi1234</span>

                        <div>一.笔记1.JavaScript简介（1）JavaScript是一种基于对象和事件驱动并具有相对安全性的客户端脚本语言。（2）JavaScript基本特点：是一种解释性脚本语言主要用来向HTML页面添加交互行为可以直接嵌入HTML页面，但写成单独的JS文件有利于结构和行为的分离跨平台特性，可以在多种平台下运行（3）JavaScript基本特性：基于对象简单性动态性平台无关性安全性2.JavaScr</div>
                    </li>
                    <li><a href="/article/1290843926198034432.htm"
                           title="WEB前端开发笔记-CSS-4" target="_blank">WEB前端开发笔记-CSS-4</a>
                        <span class="text-muted">阿渌</span>
<a class="tag" taget="_blank" href="/search/web%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91/1.htm">web前端开发</a>
                        <div>盒子模型案例-商品列表代码盒子模型案例2-商品列表div,h1,dl,dt,dd{margin:0px;padding:0px;}#production{background-color:paleturquoise;width:275px;}#production>h1{font-size:25px;font-weight:bold;line-height:40px;text-indent:3px</div>
                    </li>
                    <li><a href="/article/1290843925795381248.htm"
                           title="web前端开发笔记-CSS-3" target="_blank">web前端开发笔记-CSS-3</a>
                        <span class="text-muted">阿渌</span>
<a class="tag" taget="_blank" href="/search/web%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91/1.htm">web前端开发</a>
                        <div>CSShtml：内容（文本框）css：样式（给文本框设置长度、宽度、颜色）css优势：内容与样式分离css样式更加丰富提高浏览器的加载速度、节约网络带宽、减少代码量。利于SEO优化1.基本语法：选择器{样式名：样式值：样式名：样式值：样式名：样式值：...}颜色：支持英文单词、#6或3个十六进制Titleh1{color:red;font-size:10px;}h1标签h1标签h2标签h3标签h1</div>
                    </li>
                    <li><a href="/article/1289783632344457216.htm"
                           title="移动端农机商城项目前端开发笔记" target="_blank">移动端农机商城项目前端开发笔记</a>
                        <span class="text-muted">Brannua</span>

                        <div>项目后端文档点此项目结构的创建:基于VueCLIv3.11.0前端路由模式:hash项目页面渲染效果基于Vant组件库babel7配置按需引用vant组件本项目采用的适配不同移动端屏幕的方法rem&emflex布局get和post发送请求的区别get:获取数据,请求参数可见,通过请求头发送数据,数据量小…post:提交数据,请求参数隐藏,通过请求体发送数据,数据量大…判断空对象的方式letobj=</div>
                    </li>
                    <li><a href="/article/1288837044457512960.htm"
                           title="Vue.js前端开发笔记--Vue.js基础特性(1)" target="_blank">Vue.js前端开发笔记--Vue.js基础特性(1)</a>
                        <span class="text-muted">MDistance</span>
<a class="tag" taget="_blank" href="/search/Vuejs%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91/1.htm">Vuejs前端开发</a>
                        <div>MVVM模式Vue.js的使用是通过构造函数来创建Vue的实例，一个Vue实例相当于一个MVVM模式中的ViewModel。varvm=newVue({})可以在实例化的时候传入一个选项对象，包括数据、模板、挂载元素、生命周期钩子、方法等。模板el：类型为字符串、DOM元素或函数。template：类型为字符串，默认会将template值替换挂载元素(el值对应的元素)，并合并挂载元素和模板根节点</div>
                    </li>
                    <li><a href="/article/1288837044050665472.htm"
                           title="前端开发笔记--flex布局" target="_blank">前端开发笔记--flex布局</a>
                        <span class="text-muted">小母牛倒立</span>
<a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91/1.htm">前端开发</a>
                        <div>flex布局：个人觉得flex布局比起传统布局要优先得多（主要是容易使用），缺点是IE10及以上版本才能使用，甚至某些属性只有在IE11才能使用（而且我发现凡是不兼容主要IE的坑来的多，不是说其他浏览器没有）不过微信小程序开发时完美适配。回到主题：使用flex布局的容器，内部元素自动成为flex项目（如上图items）display:flex;IE10可用提醒：flex项目中不能使用float,c</div>
                    </li>
                    <li><a href="/article/1288836923791581184.htm"
                           title="Vue.js前端开发笔记--Vue.js基础特性(2) 之数据绑定" target="_blank">Vue.js前端开发笔记--Vue.js基础特性(2) 之数据绑定</a>
                        <span class="text-muted">MDistance</span>
<a class="tag" taget="_blank" href="/search/Vuejs%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91/1.htm">Vuejs前端开发</a>
                        <div>数据绑定Vue.js是一个数据驱动视图的框架，它的核心是一个响应式的数据绑定系统，建立绑定之后，DOM将和数据保持同步，不需要手动维护DOM，使代码更简洁易懂，提升开发效率。数据绑定语法1.文本插值数据绑定最基础的形式就是文本插值，使用双大括号标签{{}},为Mustache语法单次插值：首次赋值后再更改vm实例属性值不会引起DOM变化{{*}}Hello{{*name}}Tip:Vue.js2.</div>
                    </li>
                    <li><a href="/article/1288834327001505792.htm"
                           title="前端开发笔记--html/css总结" target="_blank">前端开发笔记--html/css总结</a>
                        <span class="text-muted">小母牛倒立</span>
<a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91/1.htm">前端开发</a>
                        <div>html、css笔记必须是html第一行，其指示浏览器关于页面使用哪个HTML版本进行编写的指令。HTML4.0中DOCTYPE声明引用dtd，因为其基于SGML，DTD规定了标记语言的规则。HTML5.0不基于SGML，所以不用引用DTD。W3C建议始终添加，加强页面兼容性，降低对浏览器的依赖，不加就是浏览器的标准（造成不同浏览器IE，火狐）可能出现不同效果。元素类型：行内元素、块级元素、空元素</div>
                    </li>
                    <li><a href="/article/1288834186781728768.htm"
                           title="Vue.js前端开发笔记--Vue.js基础特性(2) 之计算属性" target="_blank">Vue.js前端开发笔记--Vue.js基础特性(2) 之计算属性</a>
                        <span class="text-muted">MDistance</span>
<a class="tag" taget="_blank" href="/search/Vuejs%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91/1.htm">Vuejs前端开发</a>
                        <div>计算属性我们展示的数据汪汪需要经过一定的处理，除了在模板中使用绑定表达式或者使用过滤器外，Vue.js还提供了计算属性，避免在模板中加入过多的业务逻辑，保证了模板结构的清晰和可维护性。在Vue.js中，所有的计算属性都定义在computed中基础示例：{{fullName}}varvm=newVue({el:'#app',data:{firstName:'San',lastName:'Zhang'</div>
                    </li>
                    <li><a href="/article/1283340348550037504.htm"
                           title="MOOC web前端开发笔记（一）" target="_blank">MOOC web前端开发笔记（一）</a>
                        <span class="text-muted">Jason19750703</span>

                        <div>网站和网页网站互联网上用于展示特定内容的相关网页的集合。网页网站中的一页，一个网站中的网页通过“超链接”的方式被组织在一起。主页进入网站看到的第一个网页，主页的文件名通常是index网页元素logo站标导航栏文字超链接banner广告横幅表单---网站就是文件夹网页就是文件浏览器解析网页源代码，渲染网页ChromeFirefoxIESafariOpera前端技术构成与技术标准前端技术构成结构：HT</div>
                    </li>
                    <li><a href="/article/1283011457037910016.htm"
                           title="前端开发笔记 第一天 HTML常用标签" target="_blank">前端开发笔记 第一天 HTML常用标签</a>
                        <span class="text-muted">风情小姐姐</span>

                        <div>第一天html(HyperTextMarkupLanguage)超文本标记语言------结构Css(CascadingStyleSheets)css层叠样式表------------------装饰，装修Js(javascript)--------行为（制作动画浏览器最基本的脚本语言）HTMLHTML不是一种编程语言，而是一种标记语言(markuplanguage)标记语言是有一套标记标签组成H</div>
                    </li>
                    <li><a href="/article/1282624428718440448.htm"
                           title="前端学习资源分享" target="_blank">前端学习资源分享</a>
                        <span class="text-muted">weixin_34049032</span>

                        <div>2019独角兽企业重金招聘Python工程师标准>>>推荐大神文章(文字教程)1综合类前端知识体系前端知识结构Web前端开发大系概览Web前端开发大系概览-中文版智能社-精通JavaScript开发JavaScript中的this陷阱的最全收集--没有之一JS函数式编程指南腾讯移动Web前端知识库前端开发笔记本2html5深入理解HTML5标签后HTML5时代I后HTML5时代IIhtml5推广匠</div>
                    </li>
                    <li><a href="/article/1282616569377079296.htm"
                           title="前端开发笔记" target="_blank">前端开发笔记</a>
                        <span class="text-muted">weixin_33739646</span>

                        <div>1，页面做媒体查询需添加head头//移动端加上这个标签才是真正的自适应复制代码//IOS中safari允许全屏浏览复制代码//IOS中Safari顶端状态条样式复制代码//忽略将数字变为电话号复制代码//忽略识别email复制代码2，监听视频是否加载完成，禁止选择文本，禁止长按链接与图片弹出菜单去除A连接input标签，点击出现自带的阴影样式屏蔽阴影:videoElem.addEventList</div>
                    </li>
                    <li><a href="/article/1280468307509526528.htm"
                           title="Web笔记-移动前端开发笔记" target="_blank">Web笔记-移动前端开发笔记</a>
                        <span class="text-muted">IT1995</span>
<a class="tag" taget="_blank" href="/search/Web%E7%9B%B8%E5%85%B3%E6%8A%80%E6%9C%AF/1.htm">Web相关技术</a><a class="tag" taget="_blank" href="/search/web%E5%89%8D%E7%AB%AF/1.htm">web前端</a>
                        <div>因为最近有个移动端的小项目，在此稍微学习下移动端开发基础概念。免得用框架的时候莫名其妙。px(CSSpixels)：逻辑像素，浏览器使用的抽象单位；dp,pt(deviceindependentpixels)：设备无关像素；dpr(devicePixelRatio)：设备像素放缩比；计算公式：1px=(dpr)^2*dp下面先解释下dp，为设备像素放缩比：高清屏(Retina屏)：dpr都是大于等</div>
                    </li>
                                <li><a href="/article/16.htm"
                                       title="深入浅出Java Annotation(元注解和自定义注解）" target="_blank">深入浅出Java Annotation(元注解和自定义注解）</a>
                                    <span class="text-muted">Josh_Persistence</span>
<a class="tag" taget="_blank" href="/search/Java+Annotation/1.htm">Java Annotation</a><a class="tag" taget="_blank" href="/search/%E5%85%83%E6%B3%A8%E8%A7%A3/1.htm">元注解</a><a class="tag" taget="_blank" href="/search/%E8%87%AA%E5%AE%9A%E4%B9%89%E6%B3%A8%E8%A7%A3/1.htm">自定义注解</a>
                                    <div>一、基本概述 
  
  
　　 Annontation是Java5开始引入的新特征。中文名称一般叫注解。它提供了一种安全的类似注释的机制，用来将任何的信息或元数据（metadata）与程序元素（类、方法、成员变量等）进行关联。 
  
　　更通俗的意思是为程序的元素（类、方法、成员变量）加上更直观更明了的说明，这些说明信息是与程序的业务逻辑无关，并且是供指定的工具或</div>
                                </li>
                                <li><a href="/article/143.htm"
                                       title="mysql优化特定类型的查询" target="_blank">mysql优化特定类型的查询</a>
                                    <span class="text-muted">annan211</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E5%B7%A5%E4%BD%9C/1.htm">工作</a><a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a>
                                    <div>

本节所介绍的查询优化的技巧都是和特定版本相关的，所以对于未来mysql的版本未必适用。

1 优化count查询
  对于count这个函数的网上的大部分资料都是错误的或者是理解的都是一知半解的。在做优化之前我们先来看看
  真正的count()函数的作用到底是什么。
  count()是一个特殊的函数，有两种非常不同的作用，他可以统计某个列值的数量，也可以统计行数。
  在统</div>
                                </li>
                                <li><a href="/article/270.htm"
                                       title="MAC下安装多版本JDK和切换几种方式" target="_blank">MAC下安装多版本JDK和切换几种方式</a>
                                    <span class="text-muted">棋子chessman</span>
<a class="tag" taget="_blank" href="/search/jdk/1.htm">jdk</a>
                                    <div>环境： 
MAC AIR,OS X 10.10,64位 
  
历史： 
过去 Mac 上的 Java 都是由 Apple 自己提供，只支持到 Java 6，并且OS X 10.7 开始系统并不自带（而是可选安装）（原自带的是1.6）。 
后来 Apple 加入 OpenJDK 继续支持 Java 6，而 Java 7 将由 Oracle 负责提供。 
  
在终端中输入jav</div>
                                </li>
                                <li><a href="/article/397.htm"
                                       title="javaScript （1）" target="_blank">javaScript （1）</a>
                                    <span class="text-muted">Array_06</span>
<a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E6%B5%8F%E8%A7%88%E5%99%A8/1.htm">浏览器</a>
                                    <div>JavaScript 
 
1、运算符 
　　运算符就是完成操作的一系列符号，它有七类： 　　赋值运算符（=,+=,-=,*=,/=,%=,<<=,>>=,|=,&=）、算术运算符(+,-,*,/,++,--,%)、比较运算符(>,<,<=,>=,==,===,!=,!==)、逻辑运算符(||,&&,!)、条件运算(?:)、位</div>
                                </li>
                                <li><a href="/article/524.htm"
                                       title="国内顶级代码分享网站" target="_blank">国内顶级代码分享网站</a>
                                    <span class="text-muted">袁潇含</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/jdk/1.htm">jdk</a><a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a><a class="tag" taget="_blank" href="/search/.net/1.htm">.net</a><a class="tag" taget="_blank" href="/search/PHP/1.htm">PHP</a>
                                    <div>       现在国内很多开源网站感觉都是为了利益而做的 
  
        
       当然利益是肯定的,否则谁也不会免费的去做网站 
  
   &</div>
                                </li>
                                <li><a href="/article/651.htm"
                                       title="Elasticsearch、MongoDB和Hadoop比较" target="_blank">Elasticsearch、MongoDB和Hadoop比较</a>
                                    <span class="text-muted">随意而生</span>
<a class="tag" taget="_blank" href="/search/mongodb/1.htm">mongodb</a><a class="tag" taget="_blank" href="/search/hadoop/1.htm">hadoop</a><a class="tag" taget="_blank" href="/search/%E6%90%9C%E7%B4%A2%E5%BC%95%E6%93%8E/1.htm">搜索引擎</a>
                                    <div>    
IT界在过去几年中出现了一个有趣的现象。很多新的技术出现并立即拥抱了“大数据”。稍微老一点的技术也会将大数据添进自己的特性，避免落大部队太远，我们看到了不同技术之间的边际的模糊化。假如你有诸如Elasticsearch或者Solr这样的搜索引擎，它们存储着JSON文档，MongoDB存着JSON文档，或者一堆JSON文档存放在一个Hadoop集群的HDFS中。你可以使用这三种配</div>
                                </li>
                                <li><a href="/article/778.htm"
                                       title="mac os 系统科研软件总结" target="_blank">mac os 系统科研软件总结</a>
                                    <span class="text-muted">张亚雄</span>
<a class="tag" taget="_blank" href="/search/mac+os/1.htm">mac os</a>
                                    <div>1.1 Microsoft Office for Mac 2011 
     大客户版，自行搜索。 
     1.2 Latex （MacTex）: 
     系统环境：https://tug.org/mactex/ 
    &nb</div>
                                </li>
                                <li><a href="/article/905.htm"
                                       title="Maven实战（四）生命周期" target="_blank">Maven实战（四）生命周期</a>
                                    <span class="text-muted">AdyZhang</span>
<a class="tag" taget="_blank" href="/search/maven/1.htm">maven</a>
                                    <div>1. 三套生命周期     Maven拥有三套相互独立的生命周期，它们分别为clean，default和site。 每个生命周期包含一些阶段，这些阶段是有顺序的，并且后面的阶段依赖于前面的阶段，用户和Maven最直接的交互方式就是调用这些生命周期阶段。 以clean生命周期为例，它包含的阶段有pre-clean, clean 和 post</div>
                                </li>
                                <li><a href="/article/1032.htm"
                                       title="Linux下Jenkins迁移" target="_blank">Linux下Jenkins迁移</a>
                                    <span class="text-muted">aijuans</span>
<a class="tag" taget="_blank" href="/search/Jenkins/1.htm">Jenkins</a>
                                    <div>1. 将Jenkins程序目录copy过去       源程序在/export/data/tomcatRoot/ofctest-jenkins.jd.com下面                tar -cvzf jenkins.tar.gz ofctest-jenkins.jd.com &</div>
                                </li>
                                <li><a href="/article/1159.htm"
                                       title="request.getInputStream()只能获取一次的问题" target="_blank">request.getInputStream()只能获取一次的问题</a>
                                    <span class="text-muted">ayaoxinchao</span>
<a class="tag" taget="_blank" href="/search/request/1.htm">request</a><a class="tag" taget="_blank" href="/search/Inputstream/1.htm">Inputstream</a>
                                    <div>问题：在使用HTTP协议实现应用间接口通信时，服务端读取客户端请求过来的数据，会用到request.getInputStream()，第一次读取的时候可以读取到数据，但是接下来的读取操作都读取不到数据        
原因：   1. 一个InputStream对象在被读取完成后，将无法被再次读取，始终返回-1；   2. InputStream并没有实现reset方法（可以重</div>
                                </li>
                                <li><a href="/article/1286.htm"
                                       title="数据库SQL优化大总结之 百万级数据库优化方案" target="_blank">数据库SQL优化大总结之 百万级数据库优化方案</a>
                                    <span class="text-muted">BigBird2012</span>
<a class="tag" taget="_blank" href="/search/SQL%E4%BC%98%E5%8C%96/1.htm">SQL优化</a>
                                    <div>网上关于SQL优化的教程很多，但是比较杂乱。近日有空整理了一下，写出来跟大家分享一下，其中有错误和不足的地方，还请大家纠正补充。 
这篇文章我花费了大量的时间查找资料、修改、排版，希望大家阅读之后，感觉好的话推荐给更多的人，让更多的人看到、纠正以及补充。 
1.对查询进行优化，要尽量避免全表扫描，首先应考虑在 where 及 order by 涉及的列上建立索引。 
2.应尽量避免在 where </div>
                                </li>
                                <li><a href="/article/1413.htm"
                                       title="jsonObject的使用" target="_blank">jsonObject的使用</a>
                                    <span class="text-muted">bijian1013</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/json/1.htm">json</a>
                                    <div>        在项目中难免会用java处理json格式的数据，因此封装了一个JSONUtil工具类。 
JSONUtil.java 
package com.bijian.json.study;

import java.util.ArrayList;
import java.util.Date;
import java.util.HashMap;</div>
                                </li>
                                <li><a href="/article/1540.htm"
                                       title="[Zookeeper学习笔记之六]Zookeeper源代码分析之Zookeeper.WatchRegistration" target="_blank">[Zookeeper学习笔记之六]Zookeeper源代码分析之Zookeeper.WatchRegistration</a>
                                    <span class="text-muted">bit1129</span>
<a class="tag" taget="_blank" href="/search/zookeeper/1.htm">zookeeper</a>
                                    <div>Zookeeper类是Zookeeper提供给用户访问Zookeeper service的主要API，它包含了如下几个内部类 
  
  
首先分析它的内部类，从WatchRegistration开始，为指定的znode path注册一个Watcher， 
  
    /**
     * Register a watcher for a particular p</div>
                                </li>
                                <li><a href="/article/1667.htm"
                                       title="【Scala十三】Scala核心七：部分应用函数" target="_blank">【Scala十三】Scala核心七：部分应用函数</a>
                                    <span class="text-muted">bit1129</span>
<a class="tag" taget="_blank" href="/search/scala/1.htm">scala</a>
                                    <div>何为部分应用函数？ 
Partially applied function: A function that’s used in an expression and that misses some of its arguments.For instance, if function f has type Int => Int => Int, then f and f(1) are p</div>
                                </li>
                                <li><a href="/article/1794.htm"
                                       title="Tomcat Error listenerStart 终极大法" target="_blank">Tomcat Error listenerStart 终极大法</a>
                                    <span class="text-muted">ronin47</span>
<a class="tag" taget="_blank" href="/search/tomcat/1.htm">tomcat</a>
                                    <div>Tomcat报的错太含糊了，什么错都没报出来，只提示了Error listenerStart。为了调试，我们要获得更详细的日志。可以在WEB-INF/classes目录下新建一个文件叫logging.properties，内容如下 
 
Java代码  
handlers = org.apache.juli.FileHandler, java.util.logging.ConsoleHa</div>
                                </li>
                                <li><a href="/article/1921.htm"
                                       title="不用加减符号实现加减法" target="_blank">不用加减符号实现加减法</a>
                                    <span class="text-muted">BrokenDreams</span>
<a class="tag" taget="_blank" href="/search/%E5%AE%9E%E7%8E%B0/1.htm">实现</a>
                                    <div>        今天有群友发了一个问题，要求不用加减符号(包括负号)来实现加减法。 
        分析一下，先看最简单的情况，假设1+1，按二进制算的话结果是10，可以看到从右往左的第一位变为0，第二位由于进位变为1。 
   </div>
                                </li>
                                <li><a href="/article/2048.htm"
                                       title="读《研磨设计模式》-代码笔记-状态模式-State" target="_blank">读《研磨设计模式》-代码笔记-状态模式-State</a>
                                    <span class="text-muted">bylijinnan</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/1.htm">设计模式</a>
                                    <div>声明： 本文只为方便我个人查阅和理解，详细的分析以及源代码请移步 原作者的博客http://chjavach.iteye.com/ 
 
 




/*

当一个对象的内在状态改变时允许改变其行为，这个对象看起来像是改变了其类
状态模式主要解决的是当控制一个对象状态的条件表达式过于复杂时的情况
把状态的判断逻辑转移到表示不同状态的一系列类中，可以把复杂的判断逻辑简化

如果在</div>
                                </li>
                                <li><a href="/article/2175.htm"
                                       title="CUDA程序block和thread超出硬件允许值时的异常" target="_blank">CUDA程序block和thread超出硬件允许值时的异常</a>
                                    <span class="text-muted">cherishLC</span>
<a class="tag" taget="_blank" href="/search/CUDA/1.htm">CUDA</a>
                                    <div>调用CUDA的核函数时指定block 和 thread大小，该大小可以是dim3类型的（三维数组），只用一维时可以是usigned int型的。 
以下程序验证了当block或thread大小超出硬件允许值时会产生异常！！！GPU根本不会执行运算！！！ 
所以验证结果的正确性很重要！！！ 
在VS中创建CUDA项目会有一个模板，里面有更详细的状态验证。 
 
 
以下程序在K5000GPU上跑的。</div>
                                </li>
                                <li><a href="/article/2302.htm"
                                       title="诡异的超长时间GC问题定位" target="_blank">诡异的超长时间GC问题定位</a>
                                    <span class="text-muted">chenchao051</span>
<a class="tag" taget="_blank" href="/search/jvm/1.htm">jvm</a><a class="tag" taget="_blank" href="/search/cms/1.htm">cms</a><a class="tag" taget="_blank" href="/search/GC/1.htm">GC</a><a class="tag" taget="_blank" href="/search/hbase/1.htm">hbase</a><a class="tag" taget="_blank" href="/search/swap/1.htm">swap</a>
                                    <div>HBase的GC策略采用PawNew+CMS, 这是大众化的配置，ParNew经常会出现停顿时间特别长的情况，有时候甚至长到令人发指的地步，例如请看如下日志： 
2012-10-17T05:54:54.293+0800: 739594.224: [GC 739606.508: [ParNew: 996800K->110720K(996800K), 178.8826900 secs] 3700</div>
                                </li>
                                <li><a href="/article/2429.htm"
                                       title="maven环境快速搭建" target="_blank">maven环境快速搭建</a>
                                    <span class="text-muted">daizj</span>
<a class="tag" taget="_blank" href="/search/%E5%AE%89%E8%A3%85/1.htm">安装</a><a class="tag" taget="_blank" href="/search/mavne/1.htm">mavne</a><a class="tag" taget="_blank" href="/search/%E7%8E%AF%E5%A2%83%E9%85%8D%E7%BD%AE/1.htm">环境配置</a>
                                    <div>一 下载maven 
 
安装maven之前，要先安装jdk及配置JAVA_HOME环境变量。这个安装和配置java环境不用多说。 
 
maven下载地址：http://maven.apache.org/download.html，目前最新的是这个apache-maven-3.2.5-bin.zip，然后解压在任意位置，最好地址中不要带中文字符，这个做java 的都知道，地址中出现中文会出现很多</div>
                                </li>
                                <li><a href="/article/2556.htm"
                                       title="PHP网站安全，避免PHP网站受到攻击的方法" target="_blank">PHP网站安全，避免PHP网站受到攻击的方法</a>
                                    <span class="text-muted">dcj3sjt126com</span>
<a class="tag" taget="_blank" href="/search/PHP/1.htm">PHP</a>
                                    <div>  
对于PHP网站安全主要存在这样几种攻击方式:1、命令注入(Command Injection)2、eval注入(Eval Injection)3、客户端脚本攻击(Script Insertion)4、跨网站脚本攻击(Cross Site Scripting, XSS)5、SQL注入攻击(SQL injection)6、跨网站请求伪造攻击(Cross Site Request Forgerie</div>
                                </li>
                                <li><a href="/article/2683.htm"
                                       title="yii中给CGridView设置默认的排序根据时间倒序的方法" target="_blank">yii中给CGridView设置默认的排序根据时间倒序的方法</a>
                                    <span class="text-muted">dcj3sjt126com</span>
<a class="tag" taget="_blank" href="/search/GridView/1.htm">GridView</a>
                                    <div>public function searchWithRelated() { 
        $criteria = new CDbCriteria; 
 
        $criteria->together = true; //without th</div>
                                </li>
                                <li><a href="/article/2810.htm"
                                       title="Java集合对象和数组对象的转换" target="_blank">Java集合对象和数组对象的转换</a>
                                    <span class="text-muted">dyy_gusi</span>
<a class="tag" taget="_blank" href="/search/java%E9%9B%86%E5%90%88/1.htm">java集合</a>
                                    <div>    在开发中，我们经常需要将集合对象（List，Set）转换为数组对象，或者将数组对象转换为集合对象。Java提供了相互转换的工具，但是我们使用的时候需要注意，不能乱用滥用。 
1、数组对象转换为集合对象 
    最暴力的方式是new一个集合对象，然后遍历数组，依次将数组中的元素放入到新的集合中，但是这样做显然过</div>
                                </li>
                                <li><a href="/article/2937.htm"
                                       title="nginx同一主机部署多个应用" target="_blank">nginx同一主机部署多个应用</a>
                                    <span class="text-muted">geeksun</span>
<a class="tag" taget="_blank" href="/search/nginx/1.htm">nginx</a>
                                    <div>近日有一需求，需要在一台主机上用nginx部署2个php应用，分别是wordpress和wiki，探索了半天，终于部署好了，下面把过程记录下来。 
1.   在nginx下创建vhosts目录，用以放置vhost文件。 
mkdir vhosts 
  
2.   修改nginx.conf的配置， 在http节点增加下面内容设置，用来包含vhosts里的配置文件 
#</div>
                                </li>
                                <li><a href="/article/3064.htm"
                                       title="ubuntu添加admin权限的用户账号" target="_blank">ubuntu添加admin权限的用户账号</a>
                                    <span class="text-muted">hongtoushizi</span>
<a class="tag" taget="_blank" href="/search/ubuntu/1.htm">ubuntu</a><a class="tag" taget="_blank" href="/search/useradd/1.htm">useradd</a>
                                    <div>ubuntu创建账号的方式通常用到两种：useradd 和adduser .   本人尝试了useradd方法，步骤如下：  
1:useradd 
   使用useradd时，如果后面不加任何参数的话，如：sudo useradd sysadm 创建出来的用户将是默认的三无用户：无home directory ,无密码,无系统shell。 
顾应该如下操作： 
  </div>
                                </li>
                                <li><a href="/article/3191.htm"
                                       title="第五章 常用Lua开发库2-JSON库、编码转换、字符串处理" target="_blank">第五章 常用Lua开发库2-JSON库、编码转换、字符串处理</a>
                                    <span class="text-muted">jinnianshilongnian</span>
<a class="tag" taget="_blank" href="/search/nginx/1.htm">nginx</a><a class="tag" taget="_blank" href="/search/lua/1.htm">lua</a>
                                    <div>   JSON库 
  
在进行数据传输时JSON格式目前应用广泛，因此从Lua对象与JSON字符串之间相互转换是一个非常常见的功能；目前Lua也有几个JSON库，本人用过cjson、dkjson。其中cjson的语法严格（比如unicode \u0020\u7eaf），要求符合规范否则会解析失败（如\u002），而dkjson相对宽松，当然也可以通过修改cjson的源码来完成</div>
                                </li>
                                <li><a href="/article/3318.htm"
                                       title="Spring定时器配置的两种实现方式OpenSymphony Quartz和java Timer详解" target="_blank">Spring定时器配置的两种实现方式OpenSymphony Quartz和java Timer详解</a>
                                    <span class="text-muted">yaerfeng1989</span>
<a class="tag" taget="_blank" href="/search/timer/1.htm">timer</a><a class="tag" taget="_blank" href="/search/quartz/1.htm">quartz</a><a class="tag" taget="_blank" href="/search/%E5%AE%9A%E6%97%B6%E5%99%A8/1.htm">定时器</a>
                                    <div>原创整理不易，转载请注明出处：Spring定时器配置的两种实现方式OpenSymphony Quartz和java Timer详解 
代码下载地址：http://www.zuidaima.com/share/1772648445103104.htm 
有两种流行Spring定时器配置：Java的Timer类和OpenSymphony的Quartz。 
1.Java Timer定时 
首先继承jav</div>
                                </li>
                                <li><a href="/article/3445.htm"
                                       title="Linux下df与du两个命令的差别？" target="_blank">Linux下df与du两个命令的差别？</a>
                                    <span class="text-muted">pda158</span>
<a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a>
                                    <div>　一、df显示文件系统的使用情况，与du比較，就是更全盘化。   　　最经常使用的就是 df -T，显示文件系统的使用情况并显示文件系统的类型。   　　举比例如以下：   　　[root@localhost ~]# df -T   　　Filesystem                   Type &n</div>
                                </li>
                                <li><a href="/article/3572.htm"
                                       title="[转]SQLite的工具类 ---- 通过反射把Cursor封装到VO对象" target="_blank">[转]SQLite的工具类 ---- 通过反射把Cursor封装到VO对象</a>
                                    <span class="text-muted">ctfzh</span>
<a class="tag" taget="_blank" href="/search/VO/1.htm">VO</a><a class="tag" taget="_blank" href="/search/android/1.htm">android</a><a class="tag" taget="_blank" href="/search/sqlite/1.htm">sqlite</a><a class="tag" taget="_blank" href="/search/%E5%8F%8D%E5%B0%84/1.htm">反射</a><a class="tag" taget="_blank" href="/search/Cursor/1.htm">Cursor</a>
                                    <div>在写DAO层时，觉得从Cursor里一个一个的取出字段值再装到VO(值对象)里太麻烦了，就写了一个工具类，用到了反射，可以把查询记录的值装到对应的VO里，也可以生成该VO的List。 
  
使用时需要注意：   
考虑到Android的性能问题，VO没有使用Setter和Getter，而是直接用public的属性。  
表中的字段名需要和VO的属性名一样，要是不一样就得在查询的SQL中</div>
                                </li>
                                <li><a href="/article/3699.htm"
                                       title="该学习笔记用到的Employee表" target="_blank">该学习笔记用到的Employee表</a>
                                    <span class="text-muted">vipbooks</span>
<a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a><a class="tag" taget="_blank" href="/search/sql/1.htm">sql</a><a class="tag" taget="_blank" href="/search/%E5%B7%A5%E4%BD%9C/1.htm">工作</a>
                                    <div>    这是我在学习Oracle是用到的Employee表，在该笔记中用到的就是这张表，大家可以用它来学习和练习。 
 
 

drop table Employee;
-- 员工信息表
create table Employee(
       -- 员工编号
       EmpNo number(3) primary key,
       -- 姓</div>
                                </li>
                </ul>
            </div>
        </div>
    </div>

<div>
    <div class="container">
        <div class="indexes">
            <strong>按字母分类：</strong>
            <a href="/tags/A/1.htm" target="_blank">A</a><a href="/tags/B/1.htm" target="_blank">B</a><a href="/tags/C/1.htm" target="_blank">C</a><a
                href="/tags/D/1.htm" target="_blank">D</a><a href="/tags/E/1.htm" target="_blank">E</a><a href="/tags/F/1.htm" target="_blank">F</a><a
                href="/tags/G/1.htm" target="_blank">G</a><a href="/tags/H/1.htm" target="_blank">H</a><a href="/tags/I/1.htm" target="_blank">I</a><a
                href="/tags/J/1.htm" target="_blank">J</a><a href="/tags/K/1.htm" target="_blank">K</a><a href="/tags/L/1.htm" target="_blank">L</a><a
                href="/tags/M/1.htm" target="_blank">M</a><a href="/tags/N/1.htm" target="_blank">N</a><a href="/tags/O/1.htm" target="_blank">O</a><a
                href="/tags/P/1.htm" target="_blank">P</a><a href="/tags/Q/1.htm" target="_blank">Q</a><a href="/tags/R/1.htm" target="_blank">R</a><a
                href="/tags/S/1.htm" target="_blank">S</a><a href="/tags/T/1.htm" target="_blank">T</a><a href="/tags/U/1.htm" target="_blank">U</a><a
                href="/tags/V/1.htm" target="_blank">V</a><a href="/tags/W/1.htm" target="_blank">W</a><a href="/tags/X/1.htm" target="_blank">X</a><a
                href="/tags/Y/1.htm" target="_blank">Y</a><a href="/tags/Z/1.htm" target="_blank">Z</a><a href="/tags/0/1.htm" target="_blank">其他</a>
        </div>
    </div>
</div>
<footer id="footer" class="mb30 mt30">
    <div class="container">
        <div class="footBglm">
            <a target="_blank" href="/">首页</a> -
            <a target="_blank" href="/custom/about.htm">关于我们</a> -
            <a target="_blank" href="/search/Java/1.htm">站内搜索</a> -
            <a target="_blank" href="/sitemap.txt">Sitemap</a> -
            <a target="_blank" href="/custom/delete.htm">侵权投诉</a>
        </div>
        <div class="copyright">版权所有 IT知识库 CopyRight © 2000-2050 E-COM-NET.COM , All Rights Reserved.
<!--            <a href="https://beian.miit.gov.cn/" rel="nofollow" target="_blank">京ICP备09083238号</a><br>-->
        </div>
    </div>
</footer>
<!-- 代码高亮 -->
<script type="text/javascript" src="/static/syntaxhighlighter/scripts/shCore.js"></script>
<script type="text/javascript" src="/static/syntaxhighlighter/scripts/shLegacy.js"></script>
<script type="text/javascript" src="/static/syntaxhighlighter/scripts/shAutoloader.js"></script>
<link type="text/css" rel="stylesheet" href="/static/syntaxhighlighter/styles/shCoreDefault.css"/>
<script type="text/javascript" src="/static/syntaxhighlighter/src/my_start_1.js"></script>





</body>

</html>

 
  
  
  
 
host

host1

hello