码迷,mamicode.com
首页 > 其他好文 > 详细

整理前端常见问题及解决方法

时间:2016-05-24 00:24:34      阅读:194      评论:0      收藏:0      [点我收藏+]

标签:

1、

兼容ie8圆角的解决方法:
下载ie-css3.htc文件
在css中加入behavior:url(ie-css3.htc);z-index:3; position:relative 即可

2、

去掉文本框的右下角:resize:none;

3、

html5新属性:hidden 对于不支持html5的浏览器,加上*[hidden]{display:none;}

4、

div><p>这只铅笔5元</p></div>
outerHTML:
包含整个标签,不仅限于标签内部的内容,即<div><p><这只铅笔<span>5</span>元</p></div>
innerHtml:获取元素的html和文本<p><这只铅笔<span>5</span>元</p>
innerText:这只铅笔5元

5、

要在html页面浏览器标题中添加图标
在head中加入
<link rel=‘icon‘ href="images/33.ico" type=‘image/x-ico’ />

图片需要是.ico格式

6、

css3属性:
text-overflow:ellipsis; 一行中,将超出宽度的文本设置为省略号。例如sdasasadad...

(1)移动端用于显示两行文本后省略:

overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;

(2)js实现文字显示两行后超出部分省略 eg:

var oBox=$(".type2_child3").html();
var demoHtml = oBox.slice(0,34)+‘...‘;//加省略号
oBox=$(".type2_child3").html(demoHtml);
这几个属性一定要一起用:overflow:hidden;text-overflow:ellipsis;white-space:nowrap;

 

7、

jq
sibings()方法:$("p").siblings(".aa") 查找每个p元素的所有类名为.aa的元素

 

8、

var checkText=$("#select_id").find("option:selected").text(); //获取Select选择的Text
var checkValue=$("#select_id").val(); //获取Select选择的Value

 

9、

获取选中的radio的值

<input type="radio" name="sex"/>男<input type="radio" name="sex"/>女

var sex= $(‘input:radio[name="sex"]:checked‘).val();

 

10、

在安卓手机上去掉文本框获取焦点时的高亮边框。
.search_text:focus,:hover,:active{outline:0px; -webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-user-modify:read-write-plaintext-only;}

 

11、

渐变:background:linear-gradient(起颜色,终颜色);

要让渐变布满body全屏,在html{height:100%;}

 

12、

无限循环旋转图片
<img src="aa.img"/ class="aa">
<style>
.aa{animation:aa 6s linear infinite;}
@keyframes aa{
0%{transform:rotate(0deg)}
100%{transform:rotate(360deg)}
}

 

 

13、

设置字与字之间横向字距:letter-spacing,纵向:line-height

 

14、

设置多行文本的placeholder样式

textarea::-webkit-input-placeholder{}

 

15、

移动端

禁止页面滑动

var jinzhi=0;
document.addEventListener("touchmove",function(e){
if(jinzhi==0){
e.preventDefault();
e.stopPropagation();
}
},false);

 

 

16、

==比较:先将比较的两者转换为同一类型然后进行比较

===比较:不进行类型的转换,如果类型不同则直接返回false

 

17、

验证电话号码正则:  var myreg = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1}))+\d{8})$/;

只允许英文和中文:
onkeyup="value=value.replace(/[\d]/g,‘‘)"

18、

getElementsByTagName()查找标签名在ie 8及以下无效

 

整理前端常见问题及解决方法

标签:

原文地址:http://www.cnblogs.com/ss977/p/5521873.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!