Maison > interface Web > js tutoriel > Objets JS, instances liées aux données

Objets JS, instances liées aux données

小云云
Libérer: 2018-03-19 16:58:25
original
1320 Les gens l'ont consulté

Cet article partage principalement avec vous des objets JS et des exemples liés aux données. JS est un langage basé sur les objets, mais il n'est pas directement orienté objet car il n'y a pas de classes. J'espère que cela aide tout le monde.

1. Objet

Définissez essentiellement l'objet : var obj=new Object(); ou var obj={name:"xiaoming",sex:"man" } ;

var browser = {        //对象是由花括号括起来的
            name: "Firefox",
            kernel: "Gecko",
            run: function () { return "123"; }
        };
        //通过点号(.)或“[]”来访问对象的属性
        alert(browser.name + "==" + browser["name"]);
        //访问方法
        alert(browser.run());
    </script>
Copier après la connexion

Objet fenêtre globale

Objet document JavaScript
Objet cadres JavaScript
Objet historique JavaScript
Objet emplacement JavaScript
Objet navigateur JavaScript

Objet écran JavaScript

Méthodes courantes
Méthode

valueof() : renvoie la valeur d'origine de l'objet spécifié. La méthode
split() divise la chaîne en un tableau de chaînes et renvoie ce tableau.
La méthode indexOf() renvoie la position de la première occurrence d'une valeur de chaîne spécifiée dans la chaîne. La méthode
substring() est utilisée pour extraire les caractères entre deux indices spécifiés dans une chaîne. La méthode
substr() extrait de la chaîne le nombre spécifié de chaînes à partir de la position startPos. La méthode
join() est utilisée pour mettre tous les éléments du tableau dans une chaîne. La méthode
arrayObject.join(separator)
reverse() est utilisée pour inverser l'ordre des éléments dans un tableau. La méthode

slice() peut renvoyer les éléments sélectionnés du tableau existant

二、数组Array对象

基本定义:

var arr = [2, 3, 45, 6];
 var arr1 = new Array(2, 4, 5, 7);//避免此种写法
Copier après la connexion
//排序方法(升序)
        var arr = [11, 11, 2, 28, 4, 5, 1];
        //不带参数按照字符编码的顺序 return  [1, 11, 2, 28, 4, 5]
        alert(arr.sort());
        //带参数 return  [1, 2, 4, 5, 11, 28]
        //按照其他标准进行排序,就需要提供比较函数,该函数要比较两个值,然后返回一个用于说明这两个值的相对顺序的数字。
//比较函数应该具有两个参数 a 和 b
//若 a 小于 b,在排序后的数组中 a 应该出现在 b 之前,则返回一个小于 0 的值。
        //若 a 等于 b,则返回 0。
        //若 a 大于 b,则返回一个大于 0 的值。
        alert(arr.sort(
                    function (a, b) {
                        return a - b;
                    })
                );
Copier après la connexion

DOM:

D理解为web加载网页文档;

O理为documnet的Object对象;

M模型理解为网页文档的模型结构;

DOM包含window

Window对象包含属性:document、location、navigator、screen、history、frames

Document根节点包含子节点:forms、location、anchors、images、links

事件类型:

鼠标事件:click、dbclick、mousedown、mouseup、mouseover、mouseout、mousemove
键盘事件:keydown、keypress、keyup
HTML事件:load、unload、abort、error、select、change、submit、reset、resize、scroll、focus、blur

HTML标签中事件处理器的语法是:

document对象:

d

ocument对象:实际上是window对象的属性,document == window.document为true,是唯一一个既属于BOM又属于DOM的对象
document.lastModified //获取最后一次修改页面的日期的字符串表示
document.referrer //用于跟踪用户从哪里链接过来的
document.title //获取当前页面的标题,可读写
document.URL //获取当前页面的URL,可读写
document.anchors[0]或document.anchors["anchName"] //访问页面中所有的锚
document.forms[0]或document.forms["formName"] //访问页面中所有的表单
document.images[0]或document.images["imgName"] // 访问页面中所有的图像
document.links [0]或document.links["linkName"] //访问页面中所有的链接
document.applets [0]或document.applets["appletName"] //访问页面中所有的Applet
document.embeds [0]或document.embeds["embedName"] //访问页面中所有的嵌入式对象
document.write(); 或document.writeln(); //将字符串插入到调用它们的位置
Copier après la connexion

location对象:

location对象:表示载入窗口的URL,也可用window.location引用它
location.href //当前载入页面的完整URL,如http://www.somewhere.com/pictures/index.htm
location.portocol //URL中使用的协议,即双斜杠之前的部分,如http
location.host //服务器的名字,如www.wrox.com
location.hostname //通常等于host,有时会省略前面的www
location.port //URL声明的请求的端口,默认情况下,大多数URL没有端口信息,如8080
location.pathname //URL中主机名后的部分,如/pictures/index.htm
location.search //执行GET请求的URL中的问号后的部分,又称查询字符串,如?param=xxxx
location.hash //如果URL包含#,返回该符号之后的内容,如#anchor1
location.assign("http:www.baidu.com"); //同location.href,新地址都会被加到浏览器的历史栈中
location.replace("http:www.baidu.com"); //同assign(),但新地址不会被加到浏览器的历史栈中,不能通过back和forward访问
location.reload(true | false); //重新载入当前页面,为false时从浏览器缓存中重载,为true时从服务器端重载,默认为false
Copier après la connexion


navigator对象

`

navigator`对象:包含大量有关Web浏览器的信息,在检测浏览器及操作系统上非常有用,也可用window.navigator引用它
`navigator.appCodeName` //浏览器代码名的字符串表示
navigator.appName //官方浏览器名的字符串表示
navigator.appVersion //浏览器版本信息的字符串表示
navigator.cookieEnabled //如果启用cookie返回true,否则返回false
navigator.javaEnabled //如果启用java返回true,否则返回false
navigator.platform //浏览器所在计算机平台的字符串表示
navigator.plugins //安装在浏览器中的插件数组
navigator.taintEnabled //如果启用了数据污点返回true,否则返回false
navigator.userAgent //用户代理头的字符串表示
Copier après la connexion


screen对象

screen对象:用于获取某些关于用户屏幕的信息,也可用window.screen引用它
screen.width/height //屏幕的宽度与高度,以像素计
screen.availWidth/availHeight //窗口可以使用的屏幕的宽度和高度,以像素计
screen.colorDepth //用户表示颜色的位数,大多数系统采用32位
window.moveTo(0, 0);
window.resizeTo(screen.availWidth, screen.availHeight); //填充用户的屏幕
Copier après la connexion

函数赋值:

<input type="button" value="按钮2" id="ben2"/>
var btn2=document.getElementById(&#39;btn2&#39;);获得btn2按钮对象
//给btn2添加onclick属性,属性又触发了一个事件处理程序
btn2.onclick=function(){}
 //添加匿名函数
btn2.onclick=null
 //删除onclick属性
Copier après la connexion

innerText、innerHTML、outerHTML、outerText:

innerText, innerHTML, externalHTML, externalText
innerText : représente le texte entre la balise de début et la balise de fin
innerHTML : représente le code HTML de tous les éléments et le texte de l'élément
Par exemple : < ;p> Le innerText de Hello world

est Hello world, et innerHTML est Hello world
outerText : la différence avec le premier est que l'intégralité du nœud cible est remplacée et le question renvoie le même contenu que innerText
outerHTML : la différence avec le premier est qu'il remplace l'intégralité du nœud cible et renvoie le code HTML complet de l'élément, y compris l'élément lui-même

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal