一、js的引用
<script src="/Public/js/js.js"></script>
<script>
$(function(){
}
二、设宽
//读取屏幕宽度,给div设宽
document.getElementById("bingli_info").style.width=(document.getElementById("binglis").offsetWidth-document.getElementById("bingli").offsetWidth-30)+"px";
三、添加、移除、已经有的样式
1.添加 $(".top .title:first").addClass("menus");
2.移除 $(".top .title:first").removeClass("menus");
3.有了的 $(".top .title:first").hasClass("menus");
四、点击、聚焦事件
1. $(".tt").click(function(){
});
2.$("#first").focus(function(){
});
五、取值、赋值
var bbb = $(".bbb").val(); //input取值
var zhi = $(this).html();//div取值
document.getElementById('first').innerHTML = zhi; //赋值
六、css样式
$("#yijian").css("display")
七、显示、隐藏
$("#bingli_info").hide();
$("#bingli_infos").show();
八、分割
split(";");
九、for循环
for (var i=0;i<fen.length;i++)
}
十、插入div
var html ="<div class='fens'><div class='tit'>"+zhi+"</div><input type='text' class='mores' οnclick='fun(this);' value='+添加"+zhi+"'/></div>";
$("#fens").before(html);
十一、图片上传、阅览
HTML
<div class="a-upload" id="a-upload">
<input type="file" name="photo" id="userface" class="userface" οnchange="preview(this)"/><div class="div" style=" height:25px; line-height:25px; color:#999; position:absolute; bottom:0px; left:50%; margin-left:-30px;">上传图片</div>
<div id="preview"></div>
</div>
JS
function preview(file) {
var prevDiv = document.getElementById('preview');
if (file.files && file.files[0]) {
var reader = new FileReader();
reader.onload = function (evt) {
$(".userface").hide();
$(".div").hide();
prevDiv.innerHTML = '<img src="' + evt.target.result + '" />';
}
reader.readAsDataURL(file.files[0]);
} else {
$(".userface").hide();
$(".div").hide();
prevDiv.innerHTML = '<div class="img" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale,src=\'' + file.value + '\'"></div>';
}
}