前端知识小结

1.

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

2.

<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

3.

有字符串“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>

4.

<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/

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏angularejs学习篇

关于文本框输入长度验证实现

1031
来自专栏coder修行路

CSS补充之--页面布局、js补充,dom补充

CSS补充之--页面布局 主站一:(下面是一个大致的模板) <div class="pg-header"> <div style="width...

3477
来自专栏电光石火

mybatis在xml文件中处理大于号小于号的方法

用了转义字符把>和<替换掉,然后就没有问题了。

25010
来自专栏xingoo, 一个梦想做发明家的程序员

简单选择排序

选择排序时间复杂度也为O(n^2) 算法思想: 选择排序即每次length-i的长度内选择一个最小的元素,与第一个进行替换,这样大循环length次后,就可以得...

2186
来自专栏前端架构与工程

jQuery源码——.html()方法原理解析

在将字符串转化为html碎片时,一般会将字符串作为容器的innerHTML属性赋值。但innerHTML有很多局限性,比如我们想转化的字符串中有<script>...

2168
来自专栏JavaEE

JavaScript的使用前言

JavaScript作为使用得最多的脚本语言,可以说是无处不在。所有主流浏览器都支持JavaScript。目前,全世界大部分网页都使用JavaScript。它可...

912
来自专栏小壮和前端

es6之深入理解promise对象

880
来自专栏柠檬先生

Angularjs基础(十二)

ng-model-options       描述:规定如何更新模型             实例: 在失去焦点时绑定输入框的值scope 变量中。 ...

20610
来自专栏技术博文

mysql中int长度的意义

疑问: mysql的字段,unsigned int(4), 和unsinged int(5), 能存储的数值范围是否相同。如果不同,分别是多大? 答: 无论是i...

2964
来自专栏抠抠空间

JavaScript之事件及动画

一、事件 常用事件 click(function(){...}) //单击事件 hover(function(){...}) //鼠标经过事件 b...

2815

扫码关注云+社区