一、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>