jQuery修改按钮没法选中，可是不能生效的问题

时间 2019-12-19

原文原文链接

2019.9.11工做记录javascript

事项表中：expressFlag字段，0表示快递，1表示不快递html

如今须要在页面上，若是是不支持物流快递的事项，那么按钮就变成不可选中状态java

对应页面的处理：经过JQuery设置<input>属性为disabledexpress

<script type="text/javascript">
if(${service.expressFlag == '0'}){
	$("#notNeed").attr("disabled",true);
	$("#need").attr("disabled",true);
}else{
	$("#notNeed").removeAttr("disabled",true);
	$("#need").removeAttr("disabled",true); 
	/* $("#notNeed").attr("disabled",false);
	$("#need").attr("disabled",false); */
}
<script/>
</head>
<body>
</body>

可是发现，按钮只是样式变了可是仍是能够选中（后来是能够添加禁用属性，可是不能移除。而后把条件改成1，发现仍是没有变化，不能移除）浏览器

后来把js代码放在后面缓存

</head>
<body>
</body>
<script type="text/javascript">
if(${service.expressFlag == '0'}){
	$("#notNeed").attr("disabled",true);
	$("#need").attr("disabled",true);
}else{
	$("#notNeed").removeAttr("disabled",true);
	$("#need").removeAttr("disabled",true); 
	/* $("#notNeed").attr("disabled",false);
	$("#need").attr("disabled",false); */
}
<script/>

就能够正常使用。性能

PS：正常之后我再把js代码放到前面，他又能够正常禁用/取消禁用（我清理过浏览器缓存了）code

缘由猜想：因为页面加载顺序致使。htm

正常网页加载的顺序:blog

1 浏览器一边下载html网页,一边开始解析.

2解析过程当中,若发现script标签,暂停解析,网页渲染的控制权交给js引擎.

3 若是scirpt引用了外部脚本,就下载该脚本,不然直接执行.

4.执行完毕,控制权交还给js渲染引擎.恢复往下解析html网页.
--------------------------------------------------------------------

1.在html中 body部分中的js会在页面加载的时候被执行.

2.在html中head中的js会预先进行加载,反而会在页面须要调用的时候才会执行代码,因此能够将预先不执行的代码放在head中.

3.需调用先执行的时候把js放在head中,在head页面载入的时候,就同时载入了代码,在body中调用的时候就不用载入代码,速度会提升.

4.若是head中的js代码须要传入一个参数,须要body中的参数,那么这时候就会报错,由于此时页面的DOM树还未生成.

5 从js对页面下载性能方向考虑. 因为脚本会阻塞其余资源的下载,如图片和页面渲染,直到脚本所有被下载并执行完毕后,页面的渲染才会继续,所以推荐将全部的script标签放到底部.