JavaScript:知識点まとめ

18659 ワード
JavaScript
一、ホームページの頭の声明はlang=zh=lang=zh-cnを使いますか?
  • 简体中文ページ:html lang=zh-cmn-Hans
  • 繁体字中国語ページ:html lang=zh-cmn-Hant
  • 英語ページ:html lang=en
    • 二、JavaScriptは＜head＞と＜body＞の中に置いてありますか?
    先にロードと後ローディングの違いを書いて、headタグに書いて、window.onloadを使って遅延負荷の役割を果たします.たとえば:
    //   body 
<body>
<input type="button" id="btn"/>
<a href="javascript:;" id="div-box"></a>
<script>
    var oBtn = document.getElementById('btn');
    var oBox = document.getElementById('div-box');
    oBtn.onclick = function () {
        var html = '
    ';
        if (oBox.innerHTML == '') {
            oBox.innerHTML = html;
        } else {
            oBox.innerHTML = '';
        }
    };
</script>
</body>

    //  head 
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <script>
       window.onload = function (){
           var oBtn = document.getElementById('btn');
           var oBox = document.getElementById('div-box');
           oBtn.onclick = function () {
               var html = '
    ';
               if (oBox.innerHTML == '') {
                   oBox.innerHTML = html;
               } else {
                   oBox.innerHTML = '';
               }
           };
       }
    </script>
</head>
<body>
<input type="button" id="btn"/>
<a href="javascript:;" id="div-box"></a>
 
</body>

    CSS介绍以及Ccss调用方式

    1. 什么是css？
    层叠样式表：为网页标签添加属性的（表现），修饰 渲染 控制显示方式。
    css的出现解决了结构和表现排版混乱，把结构和表现分离了，减少单页面代码量，便于统一管理和维护。
    2. css如何使用？
    在HTML页面中，css的使用方式：

    • 行内样式：应用样式到网页元素内，元素style属性：
      style=“样式名称 : value ; 样式名称 : value…”
    • 业内样式：head body 之间
      < stytle >
      < /style >
      type=“test/css” 类型：文本编写的css
    • 外部样式：调用了外部样式文件 .css
      < link type=“text/css” href=“css/index.css” rel=“stylesheet” / >
      【type="text/css"类型：文本编写的css
      href=“样式文件的路径” 注意：路径遵循规则
      rel=“stylesheet” 样式的引入规范】

    三、CSS margin属性

    设置一个元素所有外边距的宽度，或者设置各边上外边距的宽度。（允许使用负值）
    margin: 0 auto介绍
    margin: 0 auto 设置对象上下间距为0，左右自动
    可拆分为：margin: 0 auto 0auto（上下）
    还可拆分为：margin-left:auto;margin-right:auto;margin-top:0;margin-bottom:0;
    作用：岁DIV设置margin:0 auto样式，是为了让DIV在浏览器水平居中。布局居中、水平居中，均加入margin:0 auto即可。
    “自动”占用可用空间
    text-align: center; //设置h1,h2,h2元素文本对齐方式
    padding: 15px 20px; //所有内边距属性
    font-size: 24px; //属性可设置字体的尺寸
    vertical-align:top; //设置元素的垂直对齐方式
    padding-top:12px; //设置p元素的内边距
    .box-body tr:last-child {} //指定属于其父元素的最后一个子元素的p的背景色

    "outer">

    "inner">
    

    

    #inner{
	margin:auto;
	width:250px;
	height:125px;
	background-image:linger-gradient(45deg,#84ECEF 10%, #F8F62F 60%, #FDC018);
}
#outer{
	height:500px;
	width:500px;
	backgroud:#1F1D20;
	background-image: linear-gradient(#757575 1px, transparent 1px), linear-gradient(90deg, #757575 1px, transparent 1px);
  background-size: 25px 25px;
}

    /*
  p   4    
*/
p{
	margin:10px 5px 15px 20px;
}

margin:10px 5px 15px 20px;
/*
     10px
    5px
    15px
     20px
*/
margin:10px,5px,15px
/*
     10px
          5px
     15px
*/
margin:10px,5px
/*
          10px
          5px
*/
margin:10px
/*
         10px
*/
    四、単一選択ボックスとチェックボックス
    チェックボックスは四角形です.
    五、labelラベルにforを付けるか、forをつけないかの違い
    for属性はLabelとどのフォーム要素との結合作用を規定しています.labelをクリックすると自動的に結合された要素にフォーカスを移動します.
    <from>
	<label for="male">Male</label>
	<input type="radio" name="sex" id="male" />
	<br/>
</from>
    もう一つの方法:＜ケーブル＞小包＜input＞
    <from action="" class="box">
	<label for="btn1">
		<input type="radio" name="aa" id="btn1"/>
		      1
	</label>
	<label for="btn2">
		<input type="radio" name="aa" id="btn2"/>
		      2
	</label>
</from>
    注意:このような使用コードは見た目が整っています.複数のシングルまたはチェックボックスの場合は、視覚的にコードの仕様が反映されますが、このような書き方に注意が必要な問題は、for属性です.
  • for属性を追加すると値が必要になります.(値は内要素inputのidです.)空のfor属性だけでは、labelは失効し、内部のinput枠のスクリーニングには関連しません.
  • forタグを付けないで、ユーザーがこのラベルを選択すると、ブラウザは自動的にラベルに関連するフォームコントロールにフォーカスを移します.2 inputに組織事件を加えて泡が出る;
    • 六、HTMLでは とスペースの違い
  • HTMLでは とスペースの違いはHTMLコードに変換文字を入力するたびに  スペースを表し、10個を入力すると ページに10個のスペースの位置が表示されます.HTMLコードにスペースを入力しても、いくつかのスペースを入力しても、最終的にページに表示されるスペースの位置は一つだけです.
  • HTMLコードの中で、&は&文字を表しています.スペースはスペースで表示されています.多くのサイトで文字を編集する場合、HTMLの中のいくつかの変換文字を入力する必要があれば、
    • に変換する必要があります.
    //              &nbsp，  HTML       ，           ，   &nbsp。
//      &      &amp    ,     
<html>
<head>
	<title>HTML     &amp  </title>
	<style type="text/css">
		body{background:#ccc;}
	</style>
</head>
<body>
<p>  ：&amp;nbsp</p>
</body>
</html>
    拡張:HTMLでは特殊嫁(HTMLシンタックス文字)の一種の表現を使用しています.スペース&表示<を表します表示>&表示する
    、ラベル説明

    改行符type="radio"を挿入するシングルボックスは、スペース&表示&overflow属性が、コンテンツが要素ボックスにオーバーフローしたときに発生することを規定しています.注意:プレイステーション属性は以下の「input」タイプに適用されます.text、search、url、telephone、email及びpassword.
    JavaScript運行メカニズム——シングルスレッド