-
Notifications
You must be signed in to change notification settings - Fork 18
Open
Description
#247-285页(第十章)
答案将于一周后更新于本贴,大家可以跟帖写答案看自己对基础知识的掌握程度如何。
跟帖回答案的都应自行思考完成,不然没有任何意义
1.写一个函数,遍历某个节点,返回该节点所拥有的所有后代节点(element类型)的数量:
<body>
<div>
<ul>
<li>Hi</li>
<li>vajoy</li>
</ul>
</div>
<div>yoyoyo</div>
<script>
function countElm(root) {
//TODO:完成它
}
console.log(countElm(document.body)); //6,即2个div、1个ul、2个li、1个script
</script>
</body>2.主域相同、子域不同的跨域通信模拟
模拟2个主域相同子域不同的页面,比如 http://www.abc.com:8080/sop/a.html 和 http://abc.com:8080/sop/b.html,在 a.html 页面插入 b.html 页面(iframe),并在 a.html 页面中将 b.html 上的 div 内容修改为“OK”。
P.S. 你可以通过修改host来模拟跨域:
127.0.0.1 abc.com
127.0.0.1 www.abc.com
a.html
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>a.html</title>
</head>
<body>
<iframe src="http://www.abc.com:8080/sop/b.html"></iframe>
<script>
//TODO: 将b.html里的div的内容改为“OK”
</script>
</body>
</html>b.html
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>b.html</title>
</head>
<body>
<div>nothing</div>
</body>
</html>3.document.anchors 和 document.links 的区别是什么?
4.说说下方html对应的页面最终会显示什么内容:
<body>
<div>yoyoyo</div>
<script>
window.onload = function(){
document.open("text/html","");
document.writeln('<div>1</div>');
document.close();
document.writeln('<div>2</div>');
document.writeln('<div>3</div>');
document.close();
}
</script>
</body>5.编写一个方法,用来打印一个节点的所有指定的特性,要求兼容旧IE
<div id="d" data-a="1" name="divname"></div>
<script>
function printAttributes(elm){
//TODO:完成该函数
}
printAttributes(document.getElementById('d'));
// id:d
// data-a:1
// name:divname
</script>6.说说下方代码存在什么问题,以及如何解决(试着说出2种解决方案)
<ul>
<li>1</li>
<li>2</li>
</ul>
<script>
var ul = document.getElementsByTagName('ul')[0],
li = document.getElementsByTagName('li');
for(var i=0; i<li.length; i++){
var new_li = document.createElement('li');
ul.appendChild(new_li)
}
</script>