首页 > 代码库 > 工作笔记（2017/02/15）

工作笔记（2017/02/15）

2024-09-04 12:14:34   221人阅读

北京时间：2017-02-15 20:58:17 农历正月十九 地点：北京市顺义区李桥镇头二营云海天公寓

今天遇到的技术难点记录如下：

1、js的splice()方法。

2、JQuery的find()方法和attr()方法。

3、Window.parent.docunment跨域问题。

4、JQuery的get()方法。

5、JQuery的toggleClass()方法。

6、MVVM模型的相关概念。

7、JavaScript的深层框架结构解析。

1、js的splice()方法。

是一个很强的数据方法，有多种用法。主要的用途就是向数组的中部插入项

删除——可以删除数组的中的任意数量的项，需指定两个参数  splice(index,howmany);

插入——可以向指定的位置插入任意数量的项，需要指定三个或三个以上的参数splice(index,num,item1,item2,,,,);在删除指定的项的位置上进行插入item1....。

替换——可以指向指定位置插入任意的项同时删除任意的项。指定的三个参数，splice（起始位置，要删除的项数，要插入的任意项）。

splice()方法最终返回一个数组，该数组中包含从元素数组中删除的项（如果没有删除项，则返回一个空值）。

script>
            var arr=Array();
            arr[0]=‘Liming‘;
            arr[1]=‘Wnaghua‘;
            arr[2]=‘Zhaosi‘;
            arr[3]=‘Liuneng‘;
            arr[4]=‘KongKing‘;
            document.write(arr+‘<br>‘);
            //向其中添加一个元素
            arr.splice(2,0,‘Jiangzeming‘);
            document.write(arr+‘<br>‘);
            //删除位与index为2的元素并替换删除的元素
            arr.splice(2,1,‘HEHE‘);
            document.write(arr+‘<br>‘);
            //删除index开始的三个元素并添加一个元素
            arr.splice(1,4,‘Dongtentkeji‘);
            document.write(arr+‘<br>‘);        
        </script>

2、JQuery的find()方法和attr()方法。

一、find()函数用于选取每个匹配元素符合指定表达式的后代元素，并以JQuery的对象形式进行返回。

find中的参数表达式可以是选择器、DOM元素、JQuery对象。

find()函数将在当前jQuery对象每个匹配元素的所有后代元素中筛选符合指定表达式的元素。

如果expr参数为字符串，则将其视作jQuery选择器，用以表示该选择器所匹配的元素。

二、attr()函数用于设置或返回当前JQuery对象所匹配的元素节点的属性值。

attr()函数的返回值是任意类型，返回值的类型取决于当前attr()函数执行的是"设置属性"操作还是"读取属性"操作。

<html>
    <head>
        <meta charset="UTF-8">
        <title>JQuery的find方法练习</title>
        <script src="http://www.mamicode.com/js/jquery-3.1.1.min.js" type="text/javascript"></script>
        <script type="text/javascript">
        $(function(){
            var pp1=$("#p1").text();
            alert(pp1);
            var pp2=$("#p2").find(‘span‘).text();
            alert(pp2);
            var pp3=$("#p3").find(‘span‘).find(‘a‘).attr(‘class‘);
            alert(pp3);
            var pp4=$("#p4").find(‘a‘).attr(‘style‘,function(index,col){
                col:‘red‘;
            });
        });
        
        </script>
    </head>
    <body>
        <p id="p1">JavaScript的find方法</p>
        <p id="p2"><span id="sp1">要素选择</span></p>
        <p id="p3"><span><a id="a1" class="haha">我是a</a></span></p>
        <p id="p4"><a style="color:green;">我是红色</a></p>
    </body>
</html>

3、Window.parent.docunment跨域问题。

在应用有frameset或者iframe的页面时，parent是父窗口，top是最顶级父窗口（有的窗口中套了好几层frameset或者iframe），self是当前窗口， opener是用open方法打开当前窗口的那个窗口。

window.self

功能：是对当前窗口自身的引用。它和window属性是等价的。

语法：window.self

注：window、self、window.self是等价的。

window.top

功能：返回顶层窗口，即浏览器窗口。

语法：window.top

注：如果窗口本身就是顶层窗口，top属性返回的是对自身的引用。

window.parent

功能：返回父窗口。

语法：window.parent

注：如果窗口本身是顶层窗口，parent属性返回的是对自身的引用。

在框架网页中，一般父窗口就是顶层窗口，但如果框架中还有框架，父窗口和顶层窗口就不一定相同了。

判断当前窗口是否在一个框架中：

<script type="text/JavaScript"> var b = window.top!=window.self; document.write( "当前窗口是否在一个框架中："+b ); </script>

你应当将框架视为窗口中的不同区域，框架是浏览器窗口中特定的部分。一个浏览器窗口可以根据你的需要分成任意多的框架，一个单个的框架也可以分成其它多个框架，即所谓的嵌套框架。

4、JQuery的get()方法。

get方法用于获取当前JQuery对象匹配的DOM元素。

5、JQuery的toggleClass()方法。

toggleClass()函数用于切换当前jQuery对象所匹配的每一个元素上指定的css类名。

所谓"切换"，就是如果该元素上已存在指定的类名，则移除掉；如果不存在，则添加该类名。

该函数属于jQuery对象(实例)。

jQueryObject.toggleClass( classNames [, switch ] )

参数描述
classNames String/Function类型指定的css类名，字符串可以通过空格分隔的方式来添加多个css类名。或者为返回css类名的函数。
switch Boolean类型一个布尔值，用于指定是添加还是移除css类名。true表示添加，false表示移除。

 

 

 

6、MVVM模型的相关概念。

 

工作笔记（2017/02/15）


联系
我们