87.课堂练习
请编写一段JavaScript脚本生成下面这段DOM结构。要求：使用标准的DOM方法或属性。
<div class="example">
<p class="slogan">姬成，长的还行 </p>
<strong>邓哥，amazing </strong>
</div>
解题思路1：利用create，setAttribute等标准语法写
解题思路2:利用div.innerHTML把代码写上去
1.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>frame</title>
</head>
<body>
<script type="text/javascript">
var div = document.createElement('div');
var p = document.createElement('p');
var strong = document.createElement('strong');
var text = document.createTextNode('谁，长得还行');
var text1 = document.createTextNode('谁，挺不错的');
div.setAttribute('class' , 'example');
p.setAttribute('class' ,'slogan' );
p.appendChild(text);
strong.appendChild(text1);
div.appendChild(p);
div.appendChild(strong);
document.body.appendChild(div);
</script>
</body>
</html>
//要学会再原型链上编程
//1.因为如果单纯利用function封装，那么里面的this就要作为参数传进来，但是利用原型链就直接this就行，谁调用它谁就是this，不用传参数
//2.还有，在原型链上的进行编程可以实现继承，下面的都可以用，一劳永逸
2.将目标节点内部的节点顺序，逆序。
eg:<div> <a></a> <em></em></div>
<div><em></em><a></a></div>
解题思路：也就是从倒数第二个开始剪切，用appendChild()实现
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>frame</title>
</head>
<body>
<div>
<span></span>
<i></i>
<p></p>
<strong></strong>
</div>
<script type="text/javascript">
var div = document.getElementsByTagName('div')[0];
Element.prototype.niXu = function (){
var child = this.childNodes;
var len = child.length;
for(var i = len-2; i >= 0; i--){
this.appendChild(child[i]);
}
}
</script>
</body>
</html>