zoukankan      html  css  js  c++  java
  • 前端知识小结

    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{

    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{

    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/

  • 相关阅读:
    CSS中的单位简介
    grid-layout
    position
    form
    objects
    个人介绍
    第十二周作业:
    第十一周作业
    第十周web作业
    第九周作业
  • 原文地址:https://www.cnblogs.com/liminjun88/p/2951703.html
Copyright © 2011-2022 走看看