Skip to content

高三精读小组课后作业(04期) #16

Description

@VaJoy

#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.htmlhttp://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.anchorsdocument.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>

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions