学习笔记-es-2017.3.2

一、JavaScript HTML DOM 元素（节点）

1、添加图片

<button onclick="myFunction()">点击添加图片</button>
<div id="div1">
    ![](images/1.jpg)
    ![](images/2.jpg)
</div>
<script type="text/javascript">
    function myFunction () {
        // 创建img
        var picture = document.createElement("img")
        picture.setAttribute('src', 'images/3.png')
        console.log(picture)
        var element = document.getElementById("div1")
        // 在div里面添加新元素
        element.appendChild(picture)
    }
</script>

2、删除图片

<button onclick="myFunction()">点击添加图片</button>
<button onclick="editElements()">点击删除图片</button>
<div id="div1">
    ![](images/1.jpg)
    ![](images/2.jpg)
</div>
<script type="text/javascript">
    function myFunction () {
        // 创建img
        var picture = document.createElement("img")
        picture.setAttribute('src', 'images/3.png')
        picture.setAttribute('id', 'img3')
        console.log(picture)
        var element = document.getElementById("div1")
        // 在div里面添加新元素
        element.appendChild(picture)
    }
    function editElements () {
        var parent = document.getElementById("div1");
        var child = document.getElementById("img3");
        child.parentNode.removeChild(child);
    }
</script>

二、ECMAScript 引用类型

Object 对象

1、Object 对象具有下列属性

• constructor
  对创建对象的函数的引用（指针）。对于 Object 对象，该指针指向原始的 Object() 函数。
• Prototype
  对该对象的对象原型的引用。对于所有的对象，它默认返回 Object 对象的一个实例。

2、Object 对象的方法：

• hasOwnProperty(property)
  判断对象是否有某个特定的属性。必须用字符串指定该属性。
• PropertyIsEnumerable
  判断给定的属性是否可以用 for...in 语句进行枚举。
• ToString()
  返回对象的原始字符串表示。对于 Object 对象，ECMA-262 没有定义这个值，所以不同的 ECMAScript 实现具有不同的值。
• ValueOf()
  返回最适合该对象的原始值。对于许多对象，该方法返回的值都与 ToString() 的返回值相同。

Boolean 对象

var oFalseObject = new Boolean ( false );
 var bResult = aFalseObject && true;

Number 对象

var iNumber = oNumberObject.valueOf();

• toFixed() 方法

toFixed() 方法返回的是具有指定位数小数的数字的字符串表示

<script type="text/javascript">
  var oNumberObject = new Number(68);
  alert(oNumberObject.toFixed(2));
</script>

• toExponential() 方法

指定要输出的小数的位数

<script type="text/javascript">
  var oNumberObject = new Number(68);
  alert(oNumberObject.toExponential(2));
</script>

String 对象

charAt() 和 charCodeAt() 方法

<script type="text/javascript">
 var oStringObject = new String("hello world");
 alert(oStringObject.charAt(1));
</script>

<script type="text/javascript">
 var oStringObject = new String("hello world");
 alert(oStringObject.charCodeAt(1));
</script>

• concat() 方法

用于把一个或多个字符串连接到 String 对象的原始值上。

<script type="text/javascript">
 var oStringObject = new String("hello");
 var sResult = oStringObject.concat("world");
 alert(sResult);
 alert(oStringObject);
</script>

• indexOf() 和 lastIndexOf() 方法

indexOf() 方法是从字符串的开头（位置 0）开始检索字符串，而 lastIndexOf() 方法则是从字符串的结尾开始检索子串。

• localeCompare() 方法

-如果 String 对象按照字母顺序排在参数中的字符串之前，返回负数。
-如果 String 对象等于参数中的字符串，返回 0
-如果 String 对象按照字母顺序排在参数中的字符串之后，返回正数。

<script type="text/javascript">
        var oStringObject1 = new String("yellow");
        var oStringObject2 = new String("brick");
        var iResult = oStringObject1.localeCompare(oStringObject2);
        if ( iResult < 0) {
            alert ( oStringObject1 + " comes before " + oStringObject2);
        }
        else if ( iResult > 0 ) {
            alert ( oStringObject1 + " comes after " + oStringObject2);
        }
        else {
            alert ( "The two strings are equal" );
        }
</script>

ECMAScript 一元运算符

<script type="text/javascript">
        var o = new Object;
        o.name = "David";
        alert(o.name);  
        delete o.name;
        alert(o.name);
</script>