html5-<div>宽度设置为100%,设置属性margin-left和margin-right时出现问题。—

<div>宽度设置为100%,设置属性margin-left和margin-right时出现问题。

在一个父容器内包含三个子容器，设置效果为左侧和右侧的部分宽度固定，中间部分宽度随浏览器宽度的变化而自适应变化。

     <div id="A3">
        <div id="DIV-A2"></div>
        <div id="DIV-C2"></div>
        <div id="DIV-B2"></div>
    </div>

 #A3{
    margin-top:10px;
}

#DIV-A2{
    width:50px;
    background-color:red;   
    height:30px;
    float:left;/*设置浮也已经脱离文档流*/
}

#DIV-C2{
    width:50px;
    background-color:red;   
    height:30px;
    float:right;/*设置浮也已经脱离文档流*/
}

#DIV-B2{
    background-color:blue;
    width:100%;/*设置百分比可实现宽度随浏览器窗口变化而变化*/
    height:30px;
}

设置margin-left后变成这个样子，本想着把margin-right设置出来应该就会恢复原样。

但发现这时候的margin-right的值无论多大都没有作用。

注释掉left单独设置right，中间区域恢复原样，但是margin-right的值任然不起作用。
单独写了个demo发现在宽度设置为百分比的时候margin-right的值不会起作用，

 <div id="A4"></div>

#A4{
    margin-top:10px;
    background-color:blue;
    width:100%;/*设置百分比可实现宽度随浏览器窗口变化而变化*/
    height:30px;
    margin-right:200px;
}

由上图可见右边距没有发生任何变化，此时margin-right的值已经到200px了。这是为何？

发布于：2017.03.02 09:35

html5 前端 css 浏览器

| 评论0 | 收藏 | 浏览6370 |

: bigcupwater

声望： 0

4个回答

按赞数排序

你的子元素已经100%宽了，和父元素一样宽，还怎么调margin-left、margin-right

发布于：2017.03.03 03:03

评论 0 |

: Young-Eric

声望： 98

首先，浏览器渲染是从左到右渲染的，这样margin-left是可以有的，而margin-right就不一定了，因为只要子元素没有100%铺满，右边剩下的部分margin-right就会自动铺满，此时设置margin-right是无效的。
第二，你所说的右边留有空白就是margin-right自动填满的部分，如果子元素width设置100%的话，此时如果设置margin-right是无效的，因为浏览器渲染的顺序导致的，此时如果你设置margin,其实你是可以查看出来margin-right是有的，就是你用浏览器查看父元素父元素的margin-left,margin-top,margin-bottom,都能显示出来，但是你仔细看右上角有个空白，那个宽度正好和你设置的margin设置的值是一样的，其实那就是没有显示出来的margin-right的，因为被100%的子元素给覆盖了。

发布于：2018.03.03 01:17

评论 0 |

: lifelong learning

声望： 5

https://zhidao.baidu.com/question/397672817.html

发布于：2017.03.03 00:04

评论 0 |

: 见了你女王大人喵姐还不跪下

声望： 106160

首先，浏览器渲染是从左到右渲染的，这样margin-left是可以有的，而margin-right就不一定了，因为只要子元素没有100%铺满，右边剩下的部分margin-right就会自动铺满，此时设置margin-right是无效的。
第二，你所说的右边留有空白就是margin-right自动填满的部分，如果子元素width设置100%的话，此时如果设置margin-right是无效的，因为浏览器渲染的顺序导致的，此时如果你设置margin,其实你是可以查看出来margin-right是有的，就是你用浏览器查看父元素的margin-left,margin-top,margin-bottom,都能显示出来，但是你仔细看右上角有个空白，那个宽度正好和你设置的margin设置的值是一样的，其实那就是没有显示出来的margin-right的，因为被100%的子元素给覆盖了。

发布于：2018.03.03 01:19

评论 0 |

: lifelong learning

声望： 5

: 插入链接

本地上传网络图片

上传中...

浏览

上传图片

插入图片

其他相关推荐

两个div并列挨着，左边的div的margin-right属性和右边的div的margin-left属性是一回事吗？: 两个div并列挨着，左边的div的margin-right属性和右边的div的margin-left属性是一回事吗？

div+css margin-top和margin-left 边距问题问题: 比喻我上下两个DIV 下面的DIV margin-top的像素是和上一个DIV有关而我左右两个 DIV margin-left 像素不是和左边的DIV有像素间距而是和屏幕的边缘有关系不知道描述的清楚不

为何设置了margin-left后，right标签不见了？: ``` /*container是一个主容器*/ #container{ margin: 0px auto 0px 0px; width: 700px; height: 100%; background-image: url(img/container-bg.gif); background-repeat: repeat-y; padding-left: 50px;/*设置了背景色竖条，为了把内容往右偏*/ } #right{ float: left; background-image: url(img/righ-bg1.gif); background-repeat: repeat-y; height: 100%; width: 190px; margin-left: 15px; background-color: darkblue; } ``` body部分 ``` <body> <div id="container"> <div id="mid"> <div id="logo"> <img id="logo-img" src="img/logo.gif" /> </div> <div id="word"> <p>2016年，一群年轻人聚到了一起</p> <p>创立了放飞思维创业设计，一个有着独特构思和非凡创意公司。</p> <p>他们致力于设计出色的作品，在不断创新的过程中找到自己发展的方向 </p> <p>并朝着那个方向继续前进</p> </div> <div id="footer"> <p class="gray">2016 © 放飞思维创意设计公司</p> <p> <a href="#">HOME</a>| <a href="#">HOME</a>| <a href="#">HOME</a>| <a href="#">HOME</a>| <a href="#">HOME</a>| <a href="#">HOME</a>| <a href="#">HOME</a> </p> <p>Design:<a href="#">Marsie</a></p> </div> </div> <div id="right">right</div> </div> </body> ```

bootstrap怎么将radio分组，组间不互相影响？: ![如何写，让1、2、3之间的选择不互相影响？](https://img-ask.csdn.net/upload/201908/14/1565769891_628287.jpg) ``` <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <link rel="stylesheet" href="../css/bootstrap.min.css" /> <style> img{width: 75px;height: auto;margin-right: 70px} .class1{} </style> <title>详情页</title> </head> <body style="margin-top:120px ;margin-left: 70px;margin-right: 100px;"> <header class="fixed-top"style="background-color: #FFFFFF;">  <div class="container-fluid"><br /> <div class="form-inline offset-1"> <img src="../image/abb.png"> <h4 style="margin-bottom: 0;">Indetail</h4> </div><hr style="margin-top: 0 ;margin-bottom: 0;"> </div> </header> <div class="container-fluid"> <div class="row"> <div class="col-5"> <div class="row"> <div class="col-md-3 bg-warning text-center ">CaseID</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "caseid" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-info text-center text-light">CaseDetailID</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "CaseDetailID" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-warning text-center ">CaseLevel</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "CaseLevel" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-info text-center text-light">OnsiteOffice</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "OnsiteOffice" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-warning text-center ">OnsiteArea</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "OnsiteArea" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-info text-center text-light">SalesOffice</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "SalesOffice" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-warning text-center ">SalesArea</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "SalesArea" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-info text-center text-light">CompanyName</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "CompanyName" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-warning text-center ">CaseOwner</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "CaseOwner" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-info text-center text-light">ProjectName</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "ProjectName" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-warning text-center ">SubmitedBy</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "SubmitedBy" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-info text-center text-light">submiteddate</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "submiteddate" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-warning text-center ">TS Owner</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "TS Owner" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-info text-center text-light">receiveqty</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "receiveqty" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-warning text-center ">BUNumber</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "BUNumber" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-info text-center text-light">ProductType</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "ProductType" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-warning text-center ">MM</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "MM" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-info text-center text-light">SerialNo</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "SerialNo" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-warning text-center ">VendorCode</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "VendorCode" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-info text-center text-light">VendorDesc</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "VendorDesc" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-warning text-center ">MMDesc</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "MMDesc" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-info text-center text-light">statusname</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "statusname" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-warning text-center ">ProblemTypeID</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "ProblemTypeID" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-info text-center text-light">ProblemTypeName</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "ProblemTypeName" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-warning text-center ">problemdesc</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "problemdesc" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-info text-center text-light">CaseDetail</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "CaseDetail" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-warning text-center ">finaladvice</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "finaladvice" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-info text-center text-light ">Comment</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "Comment" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-warning text-center ">IsDuplicated</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "IsDuplicated" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-info text-center text-light ">ServiceTypeName</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "ServiceTypeName" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-warning text-center ">SAPProductType</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "SAPProductType" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-info text-center text-light ">ReplaceID</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "ReplaceID" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-warning text-center ">ReplaceSubmitedDate</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "ReplaceSubmitedDate" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-info text-center text-light">ReplaceLocation</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "ReplaceLocation" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-warning text-center ">VendorConfirmedDate</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "VendorConfirmedDate" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-info text-center text-light">ResolvedName</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "ResolvedName" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-warning text-center ">Product解决时间</div> <div class="col-md-8 text-md-left">*Insert and show "Product解决时间" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-info text-center text-light">Product完成时间</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "Product完成时间" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-warning text-center ">With Attachment</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show With "Attachment" from SQL </div> </div> <div class="row"style="margin-top: 10px;"> <div class="col-md-3 bg-info text-center text-light">TS Link</div> <div class="col-md-8 text-md-left "style="margin-left: 10px;">*Insert and show "TS Link" from SQL </div> </div> </div> <div class="col-1">  <div style="width:1px; background:#101010;float:left;height:1400px;"></div> </div> <div class="col-6"> <form class="form-horizontal"> <div class="form-group row"> <div class="col-3"> <label for=""> <strong>1、Replacement</strong> </label> </div> <div class="col-4"> <div class="row"> <div class="col-4"> <label class="radio-inline"> <input type="radio" name="inlineRadioOptions" id="need_replacement" value="option1" > Need </label> </div> <div class="offset-1 col-6"> <label class="radio-inline"> <input type="radio" name="inlineRadioOptions" id="neednt_replacement" value="option2" > Needn't </label> </div> </div> </div> <div class="col-5"> <a class="btn btn-sm badge-info" href="mailto:#" role="button">发送邮件</a> <a class="btn btn-sm badge-info" href="#" role="button">查看信息</a> </div> </div> <div class="form-group row"> <div class="col-3"> <label for=""> <strong>2、8D Report</strong> </label> </div> <div class="col-4"> <div class="row "> <div class="col-4"> <label class="radio-inline"> <input type="radio" name="inlineRadioOptions" id="need_report" value="option3" > Need </label> </div> <div class="offset-1 col-6"> <label class="radio-inline"> <input type="radio" name="inlineRadioOptions" id="neednt_report" value="option4" > Needn't </label> </div> </div> </div> <div class="col-5"> <a class="btn btn-sm badge-info" href="mailto:#" role="button">发送邮件</a> <a class="btn btn-sm badge-info" href="#" role="button">查看信息</a> </div> </div> <div class="form-group row"> <div class="col-3"> <label for=""> <strong>3、Repair</strong> </label> </div> <div class="col-4"> <div class="row"> <div class="col-4"> <label class="radio-inline"> <input type="radio" name="inlineRadioOptions" id="need_repair" value="option5" > Need </label> </div> <div class="offset-1 col-6"> <label class="radio-inline"> <input type="radio" name="inlineRadioOptions" id="neednt_repair" value="option6"> Needn't </label> </div> </div> </div> <div class="col-5"> <a class="btn btn-sm badge-info" href="mailto:#" role="button">发送邮件</a> <a class="btn btn-sm badge-info" href="#" role="button">查看信息</a> </div> </div> </form> </div> </div> </div> </body> </html> ```

移动端能动态的设置div的margin-left的距离值吗？: ``` var width = window.screen.width; var left=(width-352)/2; TabListItem1.style.marginLeft=left+"px"; ```

div中加div，如果里面的div给margin-top，则外面的div就会整体下移，如何解决: div布局中：div中加div，如果里面的div给margin-top，则外面的div就会整体下移，如何解决

为何我DIV重叠了!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!: ``` <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Index.aspx.cs" Inherits="SES_Web.Index" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <link rel = "stylesheet" type =" text/css" href ="Css/Index.css" /> <title>XXXXX</title> </head> <body> <form id="form1" runat="server"> <div id ="Top"> <div id="logo"> </div> </div> <div id ="Center"> </div> <div id ="buttom"> </div> </form> </body> </html> ``` ``` body { margin: 0 auto; text-align: center; background-color: aqua; } body div { border: solid 1px red; margin-left: auto; margin-right: auto; } #Top { Position: Reletive; width: 1024PX; height: 100PX; } #Center { Position: Reletive; border: solid 1px red; width: 1024PX; height: 100PX; margin-left: auto; margin-right: auto; } #Buttom { Position: Reletive; border: solid 1px red; width: 1024PX; height: 100PX; margin-left: auto; margin-right: auto; } #logo { Position: Reletive; width: 1024PX; height: 100PX; background-image: url(../Imgaes/LOGO_01.png); background-repeat: repeat; margin-left: auto; margin-right: auto; } ```

如何通过js动态实现根据checkbox是否勾选来设置input状态是可输入或者只读？: ![图片说明](https://img-ask.csdn.net/upload/201909/12/1568268511_770434.jpg) ``` <div class="form-group "style="margin-left: 8%;"> <label for="return">Defect part return</label> <input type="checkbox"name="return1" style="margin-left: 20px;"id="return"/> /*checkbox勾，那么后面两个可以输入，反之就是只读状态*/ </div> <div class="form-group"style="margin-left: 5%;"> <label>Return Qty</label> <input type="text" class="form-control "name="return2"style="margin-left: 20px;" /> </div> <div class="form-group"style="margin-left: 5%;"> <label >Return date</label> <input type="text" class="form-control " placeholder="请选择日期" id="returndate"style=" height:35px; line-height: 25px;margin-left: 20px;width: 150px;"> </div> ``` ![图片说明](https://img-ask.csdn.net/upload/201909/12/1568272126_750923.jpg)![图片说明](https://img-ask.csdn.net/upload/201909/12/1568272136_747691.jpg) 这样还是不行，不知道是哪里错了

关于background的问题: 如果将一个图标设置成这个DIV的背景图片并且给这个背景图片设置了定位那这个DIV内的元素要设置margin-left 需要除开这个背景图片的宽度吗

CSS问题：div中有clear：both了，如何在在div中加margin-top: #CSS问题：div中有clear：both了，如何在在div中加margin-top **css代码** ``` .links {clear:both;margin-top:-80px;padding:0px 0 50px;background:#2d3237;height:200px;text-align:center;} .links ul{float:left;padding-right:0;line-height:30px;width:180px;padding-left:40px} .links h3{font-size:14px;line-height:30px;padding-bottom:5px;color:#fff} .links a{color:#e5e5e5} ``` **html代码** ``` <div class="links " > <ul> <li><h3>按访问者</h3></li> <li><a href="#" target="_blank">学员</a></li> <li><a href="#" target="_blank">媒体</a></li> <li><a href="#" target="_blank">求职者</a></li> </ul> </div> ``` ocial/

Java-Servlet线程安全问题: <p>在看zwchen很久之前的一篇博客，地址如下<br><br>http://zwchen.iteye.com/blog/91088<br><br>做了个测试，按照第一种做法</p> <p> </p> <p>为使用synchronized，<span style="color: #ff0000;"><strong>并未出现线程共享情况</strong></span>，（我使用的是tomcat6.0带的servlet包）数据都是</p> <p> </p> <p>SimpleServlet@c4fe76 ==> Thread[http-8080-1,5,main]: <br>Counter = 60<br>Counter = 61<br>Counter = 62<br>Counter = 63<br>Counter = 64<br>Counter = 65<br>Counter = 66<br>Counter = 67<br>Counter = 68<br>Counter = 69</p> <p> </p> <p><span style="font-family: Simsun; font-size: small;">SimpleServlet@c4fe76 ==> Thread[http-8080-1,5,main]: <br>Counter = 70<br>Counter = 71<br>Counter = 72<br>Counter = 73<br>Counter = 74<br>Counter = 75<br>Counter = 76<br>Counter = 77<br>Counter = 78<br>Counter = 79</span></p> <p> </p> <p>SimpleServlet@c4fe76 ==> Thread[http-8080-1,5,main]: <br>Counter = 80<br>Counter = 81<br>Counter = 82<br>Counter = 83<br>Counter = 84<br>Counter = 85<br>Counter = 86<br>Counter = 87<br>Counter = 88<br>Counter = 89</p> <p> </p> <p>正常输出。请问各位高手，这个是为什么？？</p> <p> </p> <p> </p> <p><span style="color: #ff0000;"><strong>还有，其中的</strong></span></p> <p><span style="font-family: Monaco, 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Consolas, 'Courier New', monospace; line-height: 18px; background-color: #fafafa;"><span style="color: #ff0000;"><strong><span class="keyword" style="color: #7f0055; font-weight: bold;">synchronized</span><span style="color: black;"> (mutex) 为什么要用mutex这个参数？</span></strong></span></span></p> <p> </p> <p>我认为<span style="color: #7f0055; font-family: Monaco, 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Consolas, 'Courier New', monospace; font-weight: bold; line-height: 18px; background-color: #fafafa;">synchronized的参数是表明同步的是哪块，所以我</span>改成我自己servlet中的req，也可以正常跑</p> <p> </p> <p>public void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException</p> <p> {</p> <p> </p> <p> <span style="font-family: Monaco, 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Consolas, 'Courier New', monospace; line-height: 18px; background-color: #fafafa;"><span class="keyword" style="color: #7f0055; font-weight: bold;">synchronized</span><span style="color: black;"> </span><span style="color: black;">(req) </span></span></p> <p> </p> <p> </p> <p><span style="color: #ff0000;"><strong>另外，最关键的：Thread.sleep((long) Math.random() * 1000);</strong></span></p> <p><span style="color: #ff0000;"><strong>我改成Thread.sleep(1000);，输出的结果就好像是线程共享了？？</strong></span></p> <p> </p> <p> </p> <p> </p> <p>SimpleServlet@64883c ==> Thread[http-8080-3,5,main]: <br>Counter = 4<br>Counter = 6<br>Counter = 10<br>Counter = 14<br>Counter = 18<br>Counter = 22<br>Counter = 26<br>Counter = 30<br>Counter = 34<br>Counter = 38</p> <p> </p> <p> </p> <p>SimpleServlet@64883c ==> Thread[http-8080-6,5,main]: <br>Counter = 4<br>Counter = 7<br>Counter = 11<br>Counter = 15<br>Counter = 19<br>Counter = 23<br>Counter = 27<br>Counter = 31<br>Counter = 35<br>Counter = 39</p> <p> </p> <p>SimpleServlet@64883c ==> Thread[http-8080-7,5,main]: <br>Counter = 4<br>Counter = 8<br>Counter = 12<br>Counter = 16<br>Counter = 20<br>Counter = 24<br>Counter = 28<br>Counter = 32<br>Counter = 36<br>Counter = 40</p> <p> </p> <p> </p> <p>下面附上 ZWCHEN先生的原文，并对他表示深深的敬意，谢谢！</p> <p><span style="font-family: Helvetica, Tahoma, Arial, sans-serif; font-size: 14px; line-height: 25px;"> </span></p> <div class="dp-highlighter" style="font-family: Monaco, 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Consolas, 'Courier New', monospace; font-size: 12px; background-color: transparent; width: 694px; margin-left: 9px; padding: 1px;"> <div class="bar"> <div class="tools" style="text-align: left; color: black; font-weight: bold; padding: 3px; margin: 0px;">Java代码 <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" width="14" height="15"> <param name="src"> <embed type="application/x-shockwave-flash" width="14" height="15" src="http://zwchen.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf"></embed></object> <a style="color: #108ac6; text-decoration: underline;" title="收藏这段代码" href="http://zwchen.iteye.com/blog/91088"><img class="star" style="border-color: initial;" src="http://zwchen.iteye.com/images/icon_star.png" alt="收藏代码"></a> </div> </div> <ol class="dp-j" style="font-size: 1em; line-height: 1.4em; margin-top: 0px; margin-right: 0px; margin-bottom: 1px; margin-left: 0px; padding-top: 2px; padding-right: 0px; padding-bottom: 2px; padding-left: 0px; background-color: #ffffff; color: #2b91af; border: 1px solid #d1d7dc;"> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"><span class="keyword" style="color: #7f0055; font-weight: bold;">public</span><span style="color: black;"> </span><span class="keyword" style="color: #7f0055; font-weight: bold;">class</span><span style="color: black;"> SimpleServlet </span><span class="keyword" style="color: #7f0055; font-weight: bold;">extends</span><span style="color: black;"> HttpServlet </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;">{ </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> <span class="comment" style="color: #008200;">// A variable that is NOT thread-safe!</span><span style="color: black;"> </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> <span class="keyword" style="color: #7f0055; font-weight: bold;">private</span><span style="color: black;"> </span><span class="keyword" style="color: #7f0055; font-weight: bold;">int</span><span style="color: black;"> counter = </span><span class="number" style="color: #c00000;">0</span><span style="color: black;">; </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> <span class="keyword" style="color: #7f0055; font-weight: bold;">public</span><span style="color: black;"> </span><span class="keyword" style="color: #7f0055; font-weight: bold;">void</span><span style="color: black;"> doGet(HttpServletRequest req, HttpServletResponse resp) </span><span class="keyword" style="color: #7f0055; font-weight: bold;">throws</span><span style="color: black;"> ServletException, IOException </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> { </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> doPost(req, resp); </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> } </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> <span class="keyword" style="color: #7f0055; font-weight: bold;">public</span><span style="color: black;"> </span><span class="keyword" style="color: #7f0055; font-weight: bold;">void</span><span style="color: black;"> doPost(HttpServletRequest req, HttpServletResponse resp) </span><span class="keyword" style="color: #7f0055; font-weight: bold;">throws</span><span style="color: black;"> ServletException, IOException </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> { </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> resp.getWriter().println(<span class="string" style="color: blue;">"<HTML><BODY>"</span><span style="color: black;">); </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> resp.getWriter().println(<span class="keyword" style="color: #7f0055; font-weight: bold;">this</span><span style="color: black;"> + </span><span class="string" style="color: blue;">" ==> "</span><span style="color: black;">); </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> resp.getWriter().println(Thread.currentThread() + <span class="string" style="color: blue;">": <br>"</span><span style="color: black;">); </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> <span class="keyword" style="color: #7f0055; font-weight: bold;">for</span><span style="color: black;"> (</span><span class="keyword" style="color: #7f0055; font-weight: bold;">int</span><span style="color: black;"> c = </span><span class="number" style="color: #c00000;">0</span><span style="color: black;">; c < </span><span class="number" style="color: #c00000;">10</span><span style="color: black;">; c++) </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> { </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> resp.getWriter().println(<span class="string" style="color: blue;">"Counter = "</span><span style="color: black;"> + counter + </span><span class="string" style="color: blue;">"<BR>"</span><span style="color: black;">); </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> <span class="keyword" style="color: #7f0055; font-weight: bold;">try</span><span style="color: black;"> </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> { </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> Thread.sleep((<span class="keyword" style="color: #7f0055; font-weight: bold;">long</span><span style="color: black;">) Math.random() * </span><span class="number" style="color: #c00000;">1000</span><span style="color: black;">); </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> counter++; </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> } </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> <span class="keyword" style="color: #7f0055; font-weight: bold;">catch</span><span style="color: black;"> (InterruptedException exc) </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> { </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> } </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> } </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> resp.getWriter().println(<span class="string" style="color: blue;">"</BODY></HTML>"</span><span style="color: black;">); </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> } </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;">} </span></li> </ol> </div> <p> <br><br>然后，我们通过一个html页面向该servlet发出三次请求： <br></p> <div class="dp-highlighter" style="font-family: Monaco, 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Consolas, 'Courier New', monospace; font-size: 12px; background-color: transparent; width: 694px; margin-left: 9px; padding: 1px;"> <div class="bar"> <div class="tools" style="text-align: left; color: black; font-weight: bold; padding: 3px; margin: 0px;">Java代码 <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" width="14" height="15"> <param name="src"> <embed type="application/x-shockwave-flash" width="14" height="15" src="http://zwchen.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf"></embed></object> <a style="color: #108ac6; text-decoration: underline;" title="收藏这段代码" href="http://zwchen.iteye.com/blog/91088"><img class="star" style="border-color: initial;" src="http://zwchen.iteye.com/images/icon_star.png" alt="收藏代码"></a> </div> </div> <ol class="dp-j" style="font-size: 1em; line-height: 1.4em; margin-top: 0px; margin-right: 0px; margin-bottom: 1px; margin-left: 0px; padding-top: 2px; padding-right: 0px; padding-bottom: 2px; padding-left: 0px; background-color: #ffffff; color: #2b91af; border: 1px solid #d1d7dc;"> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"><span style="color: black;"><HTML> </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"><BODY> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"><TABLE> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> <TR> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> <TD><IFRAME src=<span class="string" style="color: blue;">"./SimpleServlet"</span><span style="color: black;"> name=</span><span class="string" style="color: blue;">"servlet1"</span><span style="color: black;"> height=</span><span class="string" style="color: blue;">"200%"</span><span style="color: black;">> </IFRAME></TD> </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> </TR> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> <TR> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> <TD><IFRAME src=<span class="string" style="color: blue;">"./SimpleServlet"</span><span style="color: black;"> name=</span><span class="string" style="color: blue;">"servlet2"</span><span style="color: black;"> height=</span><span class="string" style="color: blue;">"200%"</span><span style="color: black;">> </IFRAME></TD> </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> </TR> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> <TR> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> <TD><IFRAME src=<span class="string" style="color: blue;">"./SimpleServlet"</span><span style="color: black;"> name=</span><span class="string" style="color: blue;">"servlet3"</span><span style="color: black;"> height=</span><span class="string" style="color: blue;">"200%"</span><span style="color: black;">> </IFRAME></TD> </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> </TR> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"></TABLE> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"></BODY> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"></HTML> </span></li> </ol> </div> <p> <br><br><br><br>刷新页面几次后，产生的结果为： <br><br>com.zwchen.servlet.SimpleServlet@11e1bbf ==> Thread[http-8081-Processor23,5,main]: <br>Counter = 60 <br>Counter = 61 <br>Counter = 62 <br>Counter = 65 <br>Counter = 68 <br>Counter = 71 <br>Counter = 74 <br>Counter = 77 <br>Counter = 80 <br>Counter = 83 <br><br><br><br>com.zwchen.servlet.SimpleServlet@11e1bbf ==> Thread[http-8081-Processor22,5,main]: <br>Counter = 61 <br>Counter = 63 <br>Counter = 66 <br>Counter = 69 <br>Counter = 72 <br>Counter = 75 <br>Counter = 78 <br>Counter = 81 <br>Counter = 84 <br>Counter = 87 <br><br><br><br>com.zwchen.servlet.SimpleServlet@11e1bbf ==> Thread[http-8081-Processor24,5,main]: <br>Counter = 61 <br>Counter = 64 <br>Counter = 67 <br>Counter = 70 <br>Counter = 73 <br>Counter = 76 <br>Counter = 79 <br>Counter = 82 <br>Counter = 85 <br>Counter = 88 <br><br>我们会发现三点： <br><br>servlet只产生了一个Servlet对象，因为输出this时，其hashcode都一样， <br><br>servlet在不同的线程（线程池）中运行，如http-8081-Processor22，http-8081-Processor23 <br><br>Count被这三个doGet方法共享，并且并行修改。 <br><br><br><br>上面的结果，违反了线程安全的两个方面。 <br><br>那么，我们怎样保证按照我们期望的结果运行呢？首先，我想保证产生的count都是顺序执行的。 <br><br>我们将Servlet代码重构如下： <br><br><br></p> <div class="dp-highlighter" style="font-family: Monaco, 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Consolas, 'Courier New', monospace; font-size: 12px; background-color: transparent; width: 694px; margin-left: 9px; padding: 1px;"> <div class="bar"> <div class="tools" style="text-align: left; color: black; font-weight: bold; padding: 3px; margin: 0px;">Java代码 <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" width="14" height="15"> <param name="src"> <embed type="application/x-shockwave-flash" width="14" height="15" src="http://zwchen.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf"></embed></object> <a style="color: #108ac6; text-decoration: underline;" title="收藏这段代码" href="http://zwchen.iteye.com/blog/91088"><img class="star" style="border-color: initial;" src="http://zwchen.iteye.com/images/icon_star.png" alt="收藏代码"></a> </div> </div> <ol class="dp-j" style="font-size: 1em; line-height: 1.4em; margin-top: 0px; margin-right: 0px; margin-bottom: 1px; margin-left: 0px; padding-top: 2px; padding-right: 0px; padding-bottom: 2px; padding-left: 0px; background-color: #ffffff; color: #2b91af; border: 1px solid #d1d7dc;"> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"><span class="keyword" style="color: #7f0055; font-weight: bold;">public</span><span style="color: black;"> </span><span class="keyword" style="color: #7f0055; font-weight: bold;">class</span><span style="color: black;"> SimpleServlet </span><span class="keyword" style="color: #7f0055; font-weight: bold;">extends</span><span style="color: black;"> HttpServlet </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;">{ </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> <span class="comment" style="color: #008200;">//A variable that is NOT thread-safe!</span><span style="color: black;"> </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> <span class="keyword" style="color: #7f0055; font-weight: bold;">private</span><span style="color: black;"> </span><span class="keyword" style="color: #7f0055; font-weight: bold;">int</span><span style="color: black;"> counter = </span><span class="number" style="color: #c00000;">0</span><span style="color: black;">; </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> <span class="keyword" style="color: #7f0055; font-weight: bold;">private</span><span style="color: black;"> String mutex = </span><span class="string" style="color: blue;">""</span><span style="color: black;">; </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> <span class="keyword" style="color: #7f0055; font-weight: bold;">public</span><span style="color: black;"> </span><span class="keyword" style="color: #7f0055; font-weight: bold;">void</span><span style="color: black;"> doGet(HttpServletRequest req, HttpServletResponse resp) </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> <span class="keyword" style="color: #7f0055; font-weight: bold;">throws</span><span style="color: black;"> ServletException, IOException </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;">{ </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> doPost(req, resp); </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> } </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> <span class="keyword" style="color: #7f0055; font-weight: bold;">public</span><span style="color: black;"> </span><span class="keyword" style="color: #7f0055; font-weight: bold;">void</span><span style="color: black;"> doPost(HttpServletRequest req, HttpServletResponse resp) </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> <span class="keyword" style="color: #7f0055; font-weight: bold;">throws</span><span style="color: black;"> ServletException, IOException </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> { </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> resp.getWriter().println(<span class="string" style="color: blue;">"<HTML><BODY>"</span><span style="color: black;">); </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> resp.getWriter().println(<span class="keyword" style="color: #7f0055; font-weight: bold;">this</span><span style="color: black;"> + </span><span class="string" style="color: blue;">": <br>"</span><span style="color: black;">); </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> <span class="keyword" style="color: #7f0055; font-weight: bold;">synchronized</span><span style="color: black;"> (mutex) </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> { </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> <span class="keyword" style="color: #7f0055; font-weight: bold;">for</span><span style="color: black;"> (</span><span class="keyword" style="color: #7f0055; font-weight: bold;">int</span><span style="color: black;"> c = </span><span class="number" style="color: #c00000;">0</span><span style="color: black;">; c < </span><span class="number" style="color: #c00000;">10</span><span style="color: black;">; c++) </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> { </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> resp.getWriter().println(<span class="string" style="color: blue;">"Counter = "</span><span style="color: black;"> + counter + </span><span class="string" style="color: blue;">"<BR>"</span><span style="color: black;">); </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> <span class="keyword" style="color: #7f0055; font-weight: bold;">try</span><span style="color: black;"> </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> { </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> Thread.sleep((<span class="keyword" style="color: #7f0055; font-weight: bold;">long</span><span style="color: black;">) Math.random() * </span><span class="number" style="color: #c00000;">1000</span><span style="color: black;">); </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> counter++; </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> } </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> <span class="keyword" style="color: #7f0055; font-weight: bold;">catch</span><span style="color: black;"> (InterruptedException exc) { } </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> } </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> } </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> resp.getWriter().println(<span class="string" style="color: blue;">"</BODY></HTML>"</span><span style="color: black;">); </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> } </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;">} </span></li> </ol> </div> <p> <br><br><br>我们的输出结果为： <br><br>com.zwchen.servlet.SimpleServlet@109da93: <br>Counter = 0 <br>Counter = 1 <br>Counter = 2 <br>Counter = 3 <br>Counter = 4 <br>Counter = 5 <br>Counter = 6 <br>Counter = 7 <br>Counter = 8 <br>Counter = 9 <br><br><br>com.zwchen.servlet.SimpleServlet@109da93: <br>Counter = 10 <br>Counter = 11 <br>Counter = 12 <br>Counter = 13 <br>Counter = 14 <br>Counter = 15 <br>Counter = 16 <br>Counter = 17 <br>Counter = 18 <br>Counter = 19 <br><br>com.zwchen.servlet.SimpleServlet@109da93: <br>Counter = 20 <br>Counter = 21 <br>Counter = 22 <br>Counter = 23 <br>Counter = 24 <br>Counter = 25 <br>Counter = 26 <br>Counter = 27 <br>Counter = 28 <br>Counter = 29 <br><br><br>这符合了我们的要求，输出都是按顺序的，这正式synchronized的含义。 <br><br>附带说一下，我现在synchronized的是一个字符串变量mutex，不是this对象，这主要是从performance和Scalability考虑。Synchronized用在this对象上，会带来严重的可伸缩性的问题（Scalability），所有的并发请求都要排队！</p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p>

div 的float属性设置后，对div的宽度的影响: div如果不设置float属性时，宽度为默认父级容器的宽度，但是设置float：left后， div的宽度就会变为他里面内容的实际宽度，没明白是为什么？求教

被Hibernate的Session绊了一跤: <p>写这篇博客的原因是出于昨天我在问答频道的一个问题，该问题如下：</p> <p> </p> <p><span style="font-family: Arial; line-height: 18px;"> 当在servlet中调用DAO的save方法并提交事务后，控制台显示已经执行了sql语句，但是却没有向数据库中记录，如果把数据库的隔离级别设置为未提交读，这是可以看见刚插入的记录，但是之前已经调用了提交事务的语句，这是为什么呢？ <br>注：主键生成策略为“native”，数据库是MySQL。<br><strong style="font-weight: bold;">问题补充：</strong><br>已经把数据库操作放到了事务中，而当第二条记录提交的时候才会向数据库中插入第一条记录，而新提交的记录不会被插入。<br><strong style="font-weight: bold;">问题补充：</strong></span></p> <p><span style="font-family: Consolas; line-height: 18px;"> <div class="bar"> <div class="tools" style="text-align: left; color: black; font-weight: bold; padding: 3px; margin: 0px;">Java代码 ;</div> </div> <ol class="dp-j" style="font-size: 1em; line-height: 1.4em; background-color: #ffffff; margin-top: 0px; margin-right: 0px; margin-bottom: 1px; margin-left: 0px; padding-top: 2px; padding-right: 0px; padding-bottom: 2px; padding-left: 0px; color: #2b91af; border: 1px solid #d1d7dc;"> <li style="font-size: 1em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; padding-left: 10px; line-height: 18px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px;"><span style="color: black;"><span style="color: black;">UserDAO userDAO = </span><span class="keyword" style="color: #7f0055; font-weight: bold;">new</span><span style="color: black;"> UserDAO(); </span></span></li> <li style="font-size: 1em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; padding-left: 10px; line-height: 18px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px;"><span style="color: black;"> User user = <span class="keyword" style="color: #7f0055; font-weight: bold;">new</span><span style="color: black;"> User(); </span></span></li> <li style="font-size: 1em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; padding-left: 10px; line-height: 18px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; padding-left: 10px; line-height: 18px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px;"><span style="color: black;"> SessionFactory sessionFactory = HibernateSessionFactory.getSessionFactory(); </span></li> <li style="font-size: 1em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; padding-left: 10px; line-height: 18px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px;"><span style="color: black;"> Session session = sessionFactory.openSession(); </span></li> <li style="font-size: 1em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; padding-left: 10px; line-height: 18px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px;"><span style="color: black;"> Transaction tx = <span class="keyword" style="color: #7f0055; font-weight: bold;">null</span><span style="color: black;">; </span></span></li> <li style="font-size: 1em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; padding-left: 10px; line-height: 18px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; padding-left: 10px; line-height: 18px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px;"><span style="color: black;"> user.setUsername(registerForm.getUsername()); </span></li> <li style="font-size: 1em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; padding-left: 10px; line-height: 18px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; padding-left: 10px; line-height: 18px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px;"><span style="color: black;"> user.setEmail(registerForm.getEmail()); </span></li> <li style="font-size: 1em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; padding-left: 10px; line-height: 18px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px;"><span style="color: black;"> </span></li> <li style="font-size: 1em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; padding-left: 10px; line-height: 18px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px;"><span style="color: black;"> <span class="keyword" style="color: #7f0055; font-weight: bold;">try</span><span style="color: black;"> { </span></span></li> <li style="font-size: 1em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; padding-left: 10px; line-height: 18px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px;"><span style="color: black;"> tx = session.beginTransaction(); </span></li> <li style="font-size: 1em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; padding-left: 10px; line-height: 18px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px;"><span style="color: black;"> userDAO.save(user); </span></li> <li style="font-size: 1em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; padding-left: 10px; line-height: 18px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px;"><span style="color: black;"> tx.commit(); </span></li> <li style="font-size: 1em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; padding-left: 10px; line-height: 18px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px;"><span style="color: black;"> } </span></li> <li style="font-size: 1em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; padding-left: 10px; line-height: 18px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px;"><span style="color: black;"> <span class="keyword" style="color: #7f0055; font-weight: bold;">catch</span><span style="color: black;"> (RuntimeException e) { </span></span></li> <li style="font-size: 1em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; padding-left: 10px; line-height: 18px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px;"><span style="color: black;"> <span class="keyword" style="color: #7f0055; font-weight: bold;">if</span><span style="color: black;"> (tx != </span><span class="keyword" style="color: #7f0055; font-weight: bold;">null</span><span style="color: black;">) </span></span></li> <li style="font-size: 1em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; padding-left: 10px; line-height: 18px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px;"><span style="color: black;"> tx.rollback(); </span></li> <li style="font-size: 1em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; padding-left: 10px; line-height: 18px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px;"><span style="color: black;"> <span class="keyword" style="color: #7f0055; font-weight: bold;">throw</span><span style="color: black;"> e; </span></span></li> <li style="font-size: 1em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; padding-left: 10px; line-height: 18px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px;"><span style="color: black;"> } </span></li> <li style="font-size: 1em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; padding-left: 10px; line-height: 18px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px;"><span style="color: black;"> <span class="keyword" style="color: #7f0055; font-weight: bold;">finally</span><span style="color: black;"> { </span></span></li> <li style="font-size: 1em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; padding-left: 10px; line-height: 18px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px;"><span style="color: black;"> session.close(); </span></li> <li style="font-size: 1em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; padding-left: 10px; line-height: 18px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px;"><span style="color: black;"> } </span></li> </ol></span></p> <p><span style="font-family: Arial; line-height: 18px;"> <div class="dp-highlighter" style="font-family: Consolas, 'Courier New', Courier, mono; font-size: 12px; background-color: transparent; width: 97%; margin-left: 9px; padding: 1px;"> <div class="bar"> <div class="tools" style="color: black; padding: 3px; margin: 0px;"><span style="font-family: Verdana; line-height: normal;">通过查看Hibernate的代码发现的其中的问题。</span></div> <div class="tools" style="color: black; padding: 3px; margin: 0px;">我在获得Session对象的时候采用的是 sessionFactory.openSession(); Hibernate会新产生一个Session对象，接着执行userDAO.save(user)语句，而UserDAO类的save方法中用到的Session是通过HibernateSessionFactory.getSession()方法获得的，再继续看HibernateSessionFactory，其getSession（）方法如下</div> </div> <div class="tools" style="color: black; padding: 3px; margin: 0px;"> <pre name="code" class="java"> public static Session getSession() throws HibernateException { Session session = (Session) threadLocal.get(); if (session == null || !session.isOpen()) { if (sessionFactory == null) { rebuildSessionFactory(); } session = (sessionFactory != null) ? sessionFactory.openSession() : null; threadLocal.set(session); } return session; }</pre> </div> <div class="tools" style="color: black; padding: 3px; margin: 0px;"> 因此HibernateSessionFactory会为每个线程创建一个Session对象，MyEclipse所生成的DAO类就是用的这个</div> <div class="tools" style="color: black; padding: 3px; margin: 0px;">Session，这与在程序中通过openSession()方法所得到的是两个不同的Session对象，因此我在程序中调用的提交事务方法是在后一个Session中进行的，而对User对象的保存是在第一个Session中，而该Session中并没有执行提交事务操作。</div> <div class="tools" style="color: black; padding: 3px; margin: 0px;"> 但是，至于之前的为什么当我执行第二次插入操作时会把前一条记录插入的原因还没有弄清楚，哪位大哥知道，欢迎留言。</div> </div> <div class="tools" style="color: black; padding: 3px; margin: 0px;"><br></div> <div class="tools" style="color: black; padding: 3px; margin: 0px;"><br></div> </span></p>

最外面的<div>用的是margin-top:20px 发现它在ie7和ie8中的间距不一样。: 最外面的<div>用的是margin-top:20px 发现它在ie7和ie8中运行之后的间距不一样，请求解决。 IE7明显下移。谢谢！

请问为什么“会员中心”和“去购物车结算”没有跟“搜索”对齐呢？: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>传智商城下拉菜单</title> <style type="text/css"> body,ul,input,p,dl,dt,dd,h1{ margin:0; padding:0;} body{ min-width:755px; color:#6c6c6c; font-size:12px;} ul{ list-style:none;} a{ text-decoration:none;} a:hover{ text-decoration:none;} .left{ float:left;} .right{ float:right;} #top{ height:30px; line-height:30px; background:#f7f7f7; border-bottom:1px solid #eee; } #top ul{ margin:0 20px; } #top li{ float:left; padding:0 5px 0 0;} #top .line{ color:#ccc;} #top .top_nav{ max-width:1220px; margin:0 auto;} .right li{ cursor:pointer;} .right li span{ padding:0 9px;} #header{ width:1220px; margin:0 auto; padding-top:20px; overflow:hidden; } #header a{ width:240px; display:block; } #header #search{ width:500px; margin-top:15px; } #header #search input{ width:416px; height:30px; border:3px solid #e4393c; } #header #search .search_btn{ width:78px; height:36px; background:#e4393c; font-size:14px; font-weight:700; color:#fff; cursor:pointer; } #header #search p{ color:#999; font-size:12px; margin-top:5px; } #hear #info{ margin-top:18px; margin-left:20px; } #header #info input{ height:32px; border:1px solid #e3e3e3; background-color:#f7f7f7; color:#666; padding:0 10px; margin-right:12px; } .right .u100{ position:relative;} .right #u101{ width:95px; display:none; position:absolute; left:0; top:30px; background-color:#fff; border:thin; border-color:#eee; } .right #u101 a{ display:block; padding:0 10px; line-height:28px; color:#6c6c6c; } .right #u101 a:hover{ background:#f5f5f5;} </style> <script type="text/javascript"> function change(myId,mode){ document.getElementById(myId).style.display=mode; if(mode=='block'){ //设置下拉菜单所在div的边框 document.getElementById(myId).style.border="1px solid #eee"; document.getElementById(myId).style.borderTop="none"; //设置鼠标划过的li的边框及背景颜色 document.getElementById(myId).parentNode.style.backgroundColor="fff"; document.getElementById(myId).parentNode.style.border="1px solid #eee"; document.getElementById(myId).parentNode.style.borderBottom="none"; } else{ //当不显示下拉列表时，鼠标划过的li的边框及背景颜色 document.getElementById(myId).parentNode.style.backgroundColor=""; document.getElementById(myId).parentNode.style.border=""; } } </script> </head> <body>  <div id="top"> <ul class="top_nav"> <li>亲，请登录</li> <li>免费注册</li> </ul> <ul class="right"> <li> <li class="u100" onmouseover="change('u101','block')" onmouseout="change('u101','none')"> <span>我的商城</span> <div id="u101"> <a>已买到的宝贝</a> <a>我的足迹</a> <a>我的上新</a> <a>啦啦啦</a> <a>噢噢噢噢</a> <a>哈哈</a> </div> </li> </li> <li class="line">|</li> <li><span>购物车</span></li> <li class="line">|</li> <li><span>收藏夹</span></li> <li class="line">|</li> <li><span>卖家中心</span></li> <li class="line">|</li> <li><span>联系客服</span></li> </ul> </div> ![图片说明](https://img-ask.csdn.net/upload/202002/13/1581607145_511523.png) <div id="header"> <a class="left"><img src="../images/5_ (1).gif" /></a> <div id="search" class="left"> <input type="text" class="left" /> <input class="search_btn" type="button" value="搜索" /> <p>热门搜索：网页培训大学教材智能手机平板电脑</p> </div> <div id="info" class="left"> <input type="button" value="会员中心" /> <input type="button" value="去购物车结算" /> </div> </div> </body> </html> ``` ```

DIV内的按钮修改DIV宽度或者DIV怎样左右收缩: 代码如下： <div id="info" class="easyui-dialog" style="width:400px;height:300px;" closed="true" title="松陵"> <div style="height:20px;width:100%;background:#efefef;background-image:url('images/nav_linebg.jpg');"> <button type="button" style="height:20px;margin-left:210px" onclick="resizeDialog()">走势图</button> <button type="button" style="height:20px;">关闭</button> </div> <div id="column-div" style="float: left;width: 320px; height: 240px;border:1px solid blue;position:absolute;"></div> <div id="line-div" style="float: right;width: 430px; height: 240px;border:1px solid blue;position:absolute;left:350px;display:none"></div> </div> 如上：info 这DIV下面有两个主要的子DIV，column-div（默认显示）和line-div（默认关闭），还有两个button（控制line-div的显示和隐藏），现在希望info的宽度随着line-div的显示和隐藏而改变。显示则宽度变成800，关闭则还原。求大神给出代码指点，尝试很多次，没有效果，谢谢！

html css子容器宽度超过父容器时不直接换行: ![图片说明](https://img-ask.csdn.net/upload/201801/30/1517301705_386446.jpg) 问题：当li的超过div的时候就自动换行，我现在要怎么让他不换行？网上查了一下，whiteSpace无效，而且好像是文字的，貌似不能用在这种地方还有说不设置左浮动的，但是我这里是li，不设置左浮动不行啊 1.想做的效果是：向下的时候,所有的li向右移动一格li的宽度，li[n]的img的宽高变成li[n+1]的宽高，最左边生成一个img更小的li,通过改变左边距移动到li[0]的位置，img慢慢变成li[0]的img的大小，最右边的li则是img慢慢变小，慢慢透明，超过div宽度的部分就hidden，完成以后就删掉 2.现在问题是出在向右移动的时候超过div宽度的时候直接换行了，那效果就变成到右边距的时候最右边就消失了不是很会描述问题，麻烦各位没看懂的问题的大大说一下是效果没描述清楚还是问题没描述清楚，我再想想怎么问 ``` //F12复制过来的节点的属性 //div <div id="slider" style="padding: 0px; height: 320px; width: 1024px; margin-top: 50px; margin-left: 171px; background-color: red; white-space: nowrap;"> //li <li style="margin-left: 212px; display: inline; float: left; list-style-type: none; width: 200px; height: 320px; background-color: blue;"> <img src="1.jpg" style="display: block; width: 150px; height: 225px; float: none; margin-top: 37.5px; margin-left: 25px;"> <a style="display: block; width: 40px; height: 20px; margin-left: 80px;">0000</a> </li> ```

下载界面出现15秒之后抛异常无法完成下载操作: <p><span style="font-family: Arial, sans-serif, Helvetica, Tahoma; line-height: 18px;"> </span></p> <p style="padding: 0px; margin: 0px;"><span style="font-size: medium;">问题描述：当下载窗口出现时立即点下载可以下，但当先不点下载，等不到15秒，后台就会报异常，且此时点下载将无法下载</span></p> <p style="padding: 0px; margin: 0px;"> </p> <p style="padding: 0px; margin: 0px;"> </p> <p style="padding: 0px; margin: 0px;"><span style="font-size: medium;">下载代码：</span></p> <p style="padding: 0px; margin: 0px;"> </p> <div class="dp-highlighter" style="font-family: Monaco, 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Consolas, 'Courier New', monospace; font-size: 12px; background-color: transparent; width: 634px; margin-left: 9px; padding: 1px;"> <div class="bar"> <div class="tools" style="text-align: left; color: black; font-weight: bold; padding: 3px; margin: 0px;">Java代码 <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" width="14" height="15"> <param name="src"> <embed type="application/x-shockwave-flash" width="14" height="15" src="/javascripts/syntaxhighlighter/clipboard_new.swf"></embed></object> <a style="color: #006699; text-decoration: none;" title="收藏这段代码" href="/problems/60450"><img class="star" src="/images/icon_star.png" alt="收藏代码"></a> </div> </div> <ol class="dp-j" style="font-size: 1em; line-height: 1.4em; margin-top: 0px; margin-right: 0px; margin-bottom: 1px; margin-left: 0px; padding-top: 2px; padding-right: 0px; padding-bottom: 2px; padding-left: 0px; background-color: #ffffff; color: #2b91af; border: 1px solid #d1d7dc;"> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"><span style="color: black;">file = </span><span class="keyword" style="color: #7f0055; font-weight: bold;">new</span><span style="color: black;"> File(path); </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;">fin = <span class="keyword" style="color: #7f0055; font-weight: bold;">new</span><span style="color: black;"> FileInputStream(file); </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;">bin = <span class="keyword" style="color: #7f0055; font-weight: bold;">new</span><span style="color: black;"> BufferedInputStream(fin); </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;">os = response.getOutputStream(); </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;">bout = <span class="keyword" style="color: #7f0055; font-weight: bold;">new</span><span style="color: black;"> BufferedOutputStream(os); </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;">response.setHeader(<span class="string" style="color: blue;">"Content-disposition"</span><span style="color: black;">, </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> <span class="string" style="color: blue;">"attachment;filename="</span><span style="color: black;"> + </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> URLEncoder.encode(file.getName(), <span class="string" style="color: blue;">"utf-8"</span><span style="color: black;">)); </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"><span class="keyword" style="color: #7f0055; font-weight: bold;">int</span><span style="color: black;"> count = </span><span class="number" style="color: #c00000;">0</span><span style="color: black;">; </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"><span class="keyword" style="color: #7f0055; font-weight: bold;">byte</span><span style="color: black;">[] buffer = </span><span class="keyword" style="color: #7f0055; font-weight: bold;">new</span><span style="color: black;"> </span><span class="keyword" style="color: #7f0055; font-weight: bold;">byte</span><span style="color: black;">[</span><span class="number" style="color: #c00000;">8192</span><span style="color: black;">]; </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"><span class="keyword" style="color: #7f0055; font-weight: bold;">while</span><span style="color: black;">((count = bin.read(buffer)) != -</span><span class="number" style="color: #c00000;">1</span><span style="color: black;">){ </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;"> bout.write(buffer, <span class="number" style="color: #c00000;">0</span><span style="color: black;">, count); </span><span class="comment" style="color: #008200;">//异常指向的地方</span><span style="color: black;"> </span></span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;">} </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;">bout.flush(); </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;">bin.close(); </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;">bout.close(); </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;">fin.close(); </span></li> <li style="font-size: 1em; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-left-width: 1px; border-left-style: solid; border-left-color: #d1d7dc; background-color: #fafafa; line-height: 18px;"><span style="color: black;">os.close(); </span></li> </ol> </div> <p style="padding: 0px; margin: 0px;"> </p> <p style="padding: 0px; margin: 0px;"><span style="font-size: medium;">异常信息：</span></p> <p style="padding: 0px; margin: 0px;"> </p> <div class="quote_title" style="font-weight: bold; margin-top: 5px; margin-right: 0px; margin-bottom: 0px; margin-left: 15px; padding: 5px;">异常信息写道</div> <div class="quote_div" style="margin-top: 0px; margin-right: 5px; margin-bottom: 5px; margin-left: 15px; background-color: #fafafa; padding: 3px; border: 1px solid #cccccc;">2011-3-7 10:41:20 org.apache.catalina.core.StandardWrapperValve invoke<br>严重: Servlet.service() for servlet action threw exception<br>java.io.IOException<br>at org.apache.coyote.http11.InternalAprOutputBuffer.flushBuffer(InternalAprOutputBuffer.java:696)<br>at org.apache.coyote.http11.InternalAprOutputBuffer$SocketOutputBuffer.doWrite(InternalAprOutputBuffer.java:726)<br>at org.apache.coyote.http11.filters.ChunkedOutputFilter.doWrite(ChunkedOutputFilter.java:126)<br>at org.apache.coyote.http11.InternalAprOutputBuffer.doWrite(InternalAprOutputBuffer.java:532)<br>at org.apache.coyote.Response.doWrite(Response.java:560)<br>at org.apache.catalina.connector.OutputBuffer.realWriteBytes(OutputBuffer.java:353)<br>at org.apache.tomcat.util.buf.ByteChunk.flushBuffer(ByteChunk.java:432)<br>at org.apache.tomcat.util.buf.ByteChunk.append(ByteChunk.java:347)<br>at org.apache.catalina.connector.OutputBuffer.writeBytes(OutputBuffer.java:381)<br>at org.apache.catalina.connector.OutputBuffer.write(OutputBuffer.java:370)<br>at org.apache.catalina.connector.CoyoteOutputStream.write(CoyoteOutputStream.java:89)<br>at com.tool.UpDownloadHelper.download(UpDownloadHelper.java:178)</div> <p style="padding: 0px; margin: 0px;"> </p> <p style="padding: 0px; margin: 0px;"> </p> <p style="padding: 0px; margin: 0px;"><span style="font-size: medium;">请问哪位大侠可以帮小弟解决下此问题十分感谢！</span></p> <p style="padding: 0px; margin: 0px;"> </p> <p> </p>

为什么body元素的background-image会渲染到margin上？: # 问题我使用background-image属性给body元素添加背景图片，然后设置background-position到右下角，设置body的margin值后，背景图片没有按照background-origin属性渲染，从margin就开始渲染了。然后我测试div等元素，并没有这种情况。 # 代码 ```html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>test</title> </head> <style> body { margin: 100px; height: 500px; border: 1px solid red; background-image: url("http://img1.imgtn.bdimg.com/it/u=1600553076,1284989575&fm=26&gp=0.jpg"); background-repeat: no-repeat; background-position: right bottom; background-origin: border-box; overflow-y: hidden; } </style> <body></body> </html> ``` 效果： ![图片说明](https://img-ask.csdn.net/upload/202001/08/1578457819_943635.png) 背景图片从margin就开始渲染了，但是换成div，不会出现这种情况。 **！！！在此提问此bug的原理，不询问解决方案。！！！**

终于明白阿里百度这样的大公司，为什么面试经常拿ThreadLocal考验求职者了: 点击上面↑「爱开发」关注我们每晚10点，捕获技术思考和创业资源洞察什么是ThreadLocalThreadLocal是一个本地线程副本变量工具类，各个线程都拥有一份线程私...

《奇巧淫技》系列-python！！每天早上八点自动发送天气预报邮件到QQ邮箱: 将代码部署服务器，每日早上定时获取到天气数据，并发送到邮箱。也可以说是一个小人工智障。思路可以运用在不同地方，主要介绍的是思路。

面试官问我：什么是消息队列？什么场景需要他？用了会出现什么问题？: 你知道的越多，你不知道的越多点赞再看，养成习惯 GitHub上已经开源 https://github.com/JavaFamily 有一线大厂面试点脑图、个人联系方式和人才交流群，欢迎Star和完善前言消息队列在互联网技术存储方面使用如此广泛，几乎所有的后端技术面试官都要在消息队列的使用和原理方面对小伙伴们进行360°的刁难。作为一个在互联网公司面一次拿一次Offer的面霸...

8年经验面试官详解 Java 面试秘诀: 作者 |胡书敏责编 | 刘静出品 | CSDN（ID：CSDNnews）本人目前在一家知名外企担任架构师，而且最近八年来，在多家外企和互联网公司担任Java技术面试官，前后累计面试了有两三百位候选人。在本文里，就将结合本人的面试经验，针对Java初学者、Java初级开发和Java开发，给出若干准备简历和准备面试的建议。 Java程序员准备和投递简历的实...

究竟你适不适合买Mac？: 我清晰的记得，刚买的macbook pro回到家，开机后第一件事情，就是上了淘宝网，花了500元钱，找了一个上门维修电脑的师傅，上门给我装了一个windows系统。。。。。。表砍我。。。当时买mac的初衷，只是想要个固态硬盘的笔记本，用来运行一些复杂的扑克软件。而看了当时所有的SSD笔记本后，最终决定，还是买个好（xiong）看（da）的。已经有好几个朋友问我mba怎么样了，所以今天尽量客观...

MyBatis研习录(01)——MyBatis概述与入门: MyBatis 是一款优秀的持久层框架，它支持定制化 SQL、存储过程以及高级映射。MyBatis原本是apache的一个开源项目iBatis, 2010年该项目由apache software foundation 迁移到了google code并改名为MyBatis 。2013年11月MyBatis又迁移到Github。

程序员一般通过什么途径接私活？: 二哥，你好，我想知道一般程序猿都如何接私活，我也想接，能告诉我一些方法吗？上面是一个读者“烦不烦”问我的一个问题。其实不止是“烦不烦”，还有很多读者问过我类似这样的问题。我接的私活不算多，挣到的钱也没有多少，加起来不到 20W。说实话，这个数目说出来我是有点心虚的，毕竟太少了，大家轻喷。但我想，恰好配得上“一般程序员”这个称号啊。毕竟苍蝇再小也是肉，我也算是有经验的人了。唾弃接私活、做外...

Python爬虫爬取淘宝，京东商品信息: 小编是一个理科生，不善长说一些废话。简单介绍下原理然后直接上代码。使用的工具（Python+pycharm2019.3+selenium+xpath+chromedriver）其中要使用pycharm也可以私聊我selenium是一个框架可以通过pip下载 pip installselenium -ihttps://pypi.tuna.tsinghua.edu.cn/simple/ ...

阿里程序员写了一个新手都写不出的低级bug，被骂惨了。: 这种新手都不会范的错，居然被一个工作好几年的小伙子写出来，差点被当场开除了。

Java工作4年来应聘要16K最后没要,细节如下。。。: 前奏：今天2B哥和大家分享一位前几天面试的一位应聘者，工作4年26岁，统招本科。以下就是他的简历和面试情况。基本情况：专业技能： 1、 熟悉Sping了解SpringMVC、SpringBoot、Mybatis等框架、了解SpringCloud微服务 2、 熟悉常用项目管理工具：SVN、GIT、MAVEN、Jenkins 3、 熟悉Nginx、tomca...

Python爬虫精简步骤1 获取数据: 爬虫，从本质上来说，就是利用程序在网上拿到对我们有价值的数据。爬虫能做很多事，能做商业分析，也能做生活助手，比如：分析北京近两年二手房成交均价是多少？广州的Python工程师平均薪资是多少？北京哪家餐厅粤菜最好吃？等等。这是个人利用爬虫所做到的事情，而公司，同样可以利用爬虫来实现巨大的商业价值。比如你所熟悉的搜索引擎——百度和谷歌，它们的核心技术之一也是爬虫，而且是超级爬虫。从搜索巨头到人工...

Python绘图，圣诞树，花，爱心 | Turtle篇: 每周每日，分享Python实战代码，入门资料，进阶资料，基础语法，爬虫，数据分析，web网站，机器学习，深度学习等等。公众号回复【进群】沟通交流吧，QQ扫码进群学习吧微信群 QQ群 1.画圣诞树 import turtle screen = turtle.Screen() screen.setup(800,600) circle = turtle.Turtle()...

作为一个程序员，CPU的这些硬核知识你必须会！: CPU对每个程序员来说，是个既熟悉又陌生的东西？如果你只知道CPU是中央处理器的话，那可能对你并没有什么用，那么作为程序员的我们，必须要搞懂的就是CPU这家伙是如何运行的，尤其要搞懂它里面的寄存器是怎么一回事，因为这将让你从底层明白程序的运行机制。随我一起，来好好认识下CPU这货吧把CPU掰开来看对于CPU来说，我们首先就要搞明白它是怎么回事，也就是它的内部构造，当然，CPU那么牛的一个东...

破14亿，Python分析我国存在哪些人口危机！: 一、背景二、爬取数据三、数据分析 1、总人口 2、男女人口比例 3、人口城镇化 4、人口增长率 5、人口老化（抚养比） 6、各省人口 7、世界人口四、遇到的问题遇到的问题 1、数据分页，需要获取从1949-2018年数据，观察到有近20年参数：LAST20，由此推测获取近70年的参数可设置为：LAST70 2、2019年数据没有放上去，可以手动添加上去 3、将数据进行行列转换 4、列名...

web前端javascript+jquery知识点总结: 1.Javascript 语法.用途 javascript 在前端网页中占有非常重要的地位，可以用于验证表单，制作特效等功能，它是一种描述语言，也是一种基于对象（Object）和事件驱动并具有安全性的脚本语言 ...

Python实战：抓肺炎疫情实时数据，画2019-nCoV疫情地图: 今天，群里白垩老师问如何用python画武汉肺炎疫情地图。白垩老师是研究海洋生态与地球生物的学者，国家重点实验室成员，于不惑之年学习python，实为我等学习楷模。先前我并没有关注武汉肺炎的具体数据，也没有画过类似的数据分布图。于是就拿了两个小时，专门研究了一下，遂成此文。

听说想当黑客的都玩过这个Monyer游戏（1~14攻略）: 第零关进入传送门开始第0关（游戏链接）请点击链接进入第1关：连接在左边→ ←连接在右边看不到啊。。。。（只能看到一堆大佬做完的留名，也能看到菜鸡的我，在后面~~）直接fn+f12吧 <span>连接在左边→</span> <a href="first.php"></a> <span>←连接在右边</span> o...

在家远程办公效率低？那你一定要收好这个「在家办公」神器！: 相信大家都已经收到国务院延长春节假期的消息，接下来，在家远程办公可能将会持续一段时间。但是问题来了。远程办公不是人在电脑前就当坐班了，相反，对于沟通效率，文件协作，以及信息安全都有着极高的要求。有着非常多的挑战，比如： 1在异地互相不见面的会议上，如何提高沟通效率？ 2文件之间的来往反馈如何做到及时性？如何保证信息安全？ 3如何规划安排每天工作，以及如何进行成果验收？ ...... ...

作为一个程序员，内存和磁盘的这些事情，你不得不知道啊！！！: 截止目前，我已经分享了如下几篇文章：一个程序在计算机中是如何运行的？超级干货！！！作为一个程序员，CPU的这些硬核知识你必须会！作为一个程序员，内存的这些硬核知识你必须懂！这些知识可以说是我们之前都不太重视的基础知识，可能大家在上大学的时候都学习过了，但是嘞，当时由于老师讲解的没那么有趣，又加上这些知识本身就比较枯燥，所以嘞，大家当初几乎等于没学。再说啦，学习这些，也看不出来有什么用啊！...

渗透测试-灰鸽子远控木马: 木马概述灰鸽子（ Huigezi），原本该软件适用于公司和家庭管理，其功能十分强大，不但能监视摄像头、键盘记录、监控桌面、文件操作等。还提供了黑客专用功能，如：伪装系统图标、随意更换启动项名称和表述、随意更换端口、运行后自删除、毫无提示安装等，并采用反弹链接这种缺陷设计，使得使用者拥有最高权限，一经破解即无法控制。最终导致被黑客恶意使用。原作者的灰鸽子被定义为是一款集多种控制方式于一体的木马程序...

Python：爬取疫情每日数据: 前言目前每天各大平台，如腾讯、今日头条都会更新疫情每日数据，他们的数据源都是一样的，主要都是通过各地的卫健委官网通报。以全国、湖北和上海为例，分别为以下三个网站：国家卫健委官网：http://www.nhc.gov.cn/xcs/yqtb/list_gzbd.shtml 湖北卫健委官网：http://wjw.hubei.gov.cn/bmdt/ztzl/fkxxgzbdgrfyyq/xxfb...

这个世界上人真的分三六九等，你信吗？: 偶然间，在知乎上看到一个问题一时间，勾起了我深深的回忆。以前在厂里打过两次工，做过家教，干过辅导班，做过中介。零下几度的晚上，贴过广告，满脸、满手地长冻疮。再回首那段岁月，虽然苦，但让我学会了坚持和忍耐。让我明白了，在这个世界上，无论环境多么的恶劣，只要心存希望，星星之火，亦可燎原。下文是原回答，希望能对你能有所启发。如果我说，这个世界上人真的分三六九等，...

B 站上有哪些很好的学习资源?: 哇说起B站，在小九眼里就是宝藏般的存在，放年假宅在家时一天刷6、7个小时不在话下，更别提今年的跨年晚会，我简直是跪着看完的！！最早大家聚在在B站是为了追番，再后来我在上面刷欧美新歌和漂亮小姐姐的舞蹈视频，最近两年我和周围的朋友们已经把B站当作学习教室了，而且学习成本还免费，真是个励志的好平台ヽ(.◕ฺˇд ˇ◕ฺ;)ﾉ下面我们就来盘点一下B站上优质的学习资源：综合类 Oeasy：综合...

雷火神山直播超两亿，Web播放器事件监听是怎么实现的？: Web播放器解决了在手机浏览器和PC浏览器上播放音视频数据的问题，让视音频内容可以不依赖用户安装App，就能进行播放以及在社交平台进行传播。在视频业务大数据平台中，播放数据的统计分析非常重要，所以Web播放器在使用过程中，需要对其内部的数据进行收集并上报至服务端，此时，就需要对发生在其内部的一些播放行为进行事件监听。那么Web播放器事件监听是怎么实现的呢？ 01 监听事件明细表名...

3万字总结，Mysql优化之精髓: 本文知识点较多，篇幅较长，请耐心学习 MySQL已经成为时下关系型数据库产品的中坚力量，备受互联网大厂的青睐，出门面试想进BAT，想拿高工资，不会点MySQL优化知识，拿offer的成功率会大大下降。为什么要优化系统的吞吐量瓶颈往往出现在数据库的访问速度上随着应用程序的运行，数据库的中的数据会越来越多，处理时间会相应变慢数据是存放在磁盘上的，读写速度无法和内存相比如何优化设计...

Python新型冠状病毒疫情数据自动爬取+统计+发送报告+数据屏幕（三）发送篇: 今天介绍的项目是使用 Itchat 发送统计报告项目功能设计：定时爬取疫情数据存入Mysql 进行数据分析制作疫情报告使用itchat给亲人朋友发送分析报告基于Django做数据屏幕使用Tableau做数据分析来看看最终效果目前已经完成，预计2月12日前更新使用 itchat 发送数据统计报告 itchat 是一个基于 web微信的一个框架，但微信官方并不允许使用这...

作为程序员的我，大学四年一直自学，全靠这些实用工具和学习网站！: 我本人因为高中沉迷于爱情，导致学业荒废，后来高考，毫无疑问进入了一所普普通通的大学，实在惭愧???? 我又是那么好强，现在学历不行，没办法改变的事情了，所以，进入大学开始，我就下定决心，一定要让自己掌握更多的技能，尤其选择了计算机这个行业，一定要多学习技术。在进入大学学习不久后，我就认清了一个现实：我这个大学的整体教学质量和学习风气，真的一言难尽，懂的人自然知道怎么回事？怎么办？我该如何更好的提升自...

粒子群算法求解物流配送路线问题（python）: 1.Matlab实现粒子群算法的程序代码：https://www.cnblogs.com/kexinxin/p/9858664.html matlab代码求解函数最优值：https://blog.csdn.net/zyqblog/article/details/80829043 讲解通俗易懂，有数学实例的博文：https://blog.csdn.net/daaikuaichuan/article/...

教你如何编写第一个简单的爬虫: 很多人知道爬虫，也很想利用爬虫去爬取自己想要的数据，那么爬虫到底怎么用呢？今天就教大家编写一个简单的爬虫。下面以爬取笔者的个人博客网站为例获取第一篇文章的标题名称，教大家学会一个简单的爬虫。第一步：获取页面 #!/usr/bin/python # coding: utf-8 import requests #引入包requests link = "http://www.santostang....

前端JS初级面试题二 (｡•ˇ‸ˇ•｡)老铁们！快来瞧瞧自己都会了么: 1. 传统事件绑定和符合W3C标准的事件绑定有什么区别？传统事件绑定 <div onclick="">123</div> div1.onclick = function(){}; <button onmouseover=""></button> 注意：如果给同一个元素绑定了两次或多次相同类型的事件，那么后面的绑定会覆盖前面的绑定（不支持DOM事...