前端知识小结

八哥

发布于 2018-01-18 17:17:04

5130

发布于 2018-01-18 17:17:04

var a=null==undefined?1:"abc";
var b=typeof(a);
var c=typeof(b);
var d=typeof(null);
console.log(a);
console.log(b);
console.log(c);
console.log(d);

写出a,b,c,d结果值

var a=null==undefined?1:"abc";//1
var b=typeof(a);//number
var c=typeof(b);//string
var d=typeof(null);//object

<script type="text/javascript">
var s="aBaCaD";
var r1=s.relace("a","#");
var r2=s.replace(/a/,"#");
var r1=s.replace(/a/g,"#");
console.log(s);
console.log(r1);
</script>

写出s和r1,r2,r3的值

var r1=s.relace("a","#");//只替换第一个a,结果是:#BaCaD
var r2=s.replace(/a/,"#");//正则表达式，但也只是替换第一个a，结果：#BaCaD
var r1=s.replace(/a/g,"#");//正则表达式，全局替换。#B#C#D

有字符串“15,30-40;50”，写JavaScript代码获得数值15,30,40,50.

<script type="text/javascript">
var myStr="15,30-40;50";
var pattern=/[0-9]{2}/g;//gloabl
var result=myStr.match(pattern);
for(var i=0;i<result.length;i++){
console.log(result[i]);
}
</script>

<html>
<head>Test Question</head>
<style type="text/css">
.aBox{
width:100px;
height:100px;
background:#ffcc00;
}
</style>
<body>
<div>
<div class="aBox">
<div id="abc">This is a test content!</div>
</div>
</div>
</body>
</html>

通过方法取得class="aBox"的div的宽度和高度，并且设置其背景色为红色。

思路：1.使用JavaScript取得页面嵌入样式，动态改变元素的嵌入样式。

<!DOCTYPE>
<html>
<head>
<title>Test Question</title>
</head>
<style type="text/css">
.aBox{
width:100px;
height:100px;
background:#ffcc00;
}
</style>
<body>
<div>
<div class="aBox">
<div id="abc">This is a test content!</div>
</div>
</div>
<script>
window.onload=function(){
var abcDiv=document.getElementById("abc");
var aBoxDiv=abcDiv.parentNode;
var divWidth=0;
var divHeight=0;
if(aBoxDiv.currentStyle){
divWidth=aBoxDiv.currentStyle["width"];
divHeight=aBoxDiv.currentStyle["height"];
}else{
var styleArray=aBoxDiv.ownerDocument.defaultView.getComputedStyle(aBoxDiv,null);
divWidth=styleArray["width"];
divHeight=styleArray["height"];
}
console.log(divWidth);
console.log(divHeight);
//JavaScript动态修改"嵌入样式"
var oStyleSheet=document.styleSheets[0];
var oRule=oStyleSheet.cssRules[0];
oRule.style.backgroundColor="red";
}
</script>
</body>
</html>

参考网址：

http://www.jb51.net/article/19577.htm

http://hi.baidu.com/qqljsevpepbhilq/item/827857272410ae9db6326353

http://www.w3cschool.cn/dom_cssstylesheet.html

5.谈谈你对Javascript代码的使用，优化方法。

常见的优化方法

1.将不是页面一加载就用到的JS放在body闭合之前。

2.合并多个JS文件

3.压缩文件使用工具：http://javascriptcompressor.com/

本文参与腾讯云自媒体分享计划，分享自作者个人站点/博客。

原始发表：2013-03-09 ，如有侵权请联系 cloudcommunity@tencent.com 删除

http