zoukankan      html  css  js  c++  java
  • javascript常用方法

    自己总结整理的,有什么错误的地方大家可以提出了,我进行修改。或者有什么需要添加的也可以提出来

    getElementById()方法

    这个方法返回一个与那个有着给定id属性值的元素节点相对应的对象。

    由于js区分大小写,一定要注意该方法的大小写格式和类似方法的大小写格式。

    用法: document.getElementById(“id的名称”);

    getElementByTagName()方法

    该方法返回值是一个对象数组,每个对象分别对应着文档里有着给定标签的元素。

    getElementByTagName(tagname).length可以获取数组中对象的个数。

    getAttribute()方法

    获取对象的属性

    Object.getAttribute(“属性名称”);

    setAttribute()方法

    设置对象的属性

    setAttribute(“属性名称”,”属性名”);

    childNodes属性

    属性将返回一个数组,这个数组包含给定元素节点的全部子元素(包括元素节点,文本节点,属性节点);

    用法:var array= element.childNodes;  可以继续调用length属性,获取子元素的个数。

    document.body

    就相当于网页中的body元素,不用专门获取。

    nodeType属性

    childNodes属性返回值是一个对象数组,包含所有的元素节点(包括元素节点,文本节点,属性节点)。调用nodeType属性返回值共有三种:1、2、3;如果节点类型是元素节点将返回1,如果节点类型是属性节点将返回2,如果节点类型是文本节点将返回3.

    用法:node.nodeTye;

    nodeValue属性

    查询或者设置节点的值

    用法:

    查询:var des=document.getElementById(“des”);

    alert(des.childNodes[0].nodeValue);

    设置:var firstp=document.getElementById("myp");

    //       firstp.firstChild.nodeValue="我是改变后的值";

                           Firstp.childNodes[0].nodeValue=”我是改变后的值”;

    firstChild和lastChild属性

    获取该元素的第一个或者是最后一个子节点。

    document.write()方法

    write()方法可以快速的把字符串插入到文档里面

    用法 document.write("<p>这是一个段落</p>");

    缺点:必须在<body></body>部分使用<script>document.write("11")</script>标签才能调用该方法。即使将该方法写在外部js文件中,也必须在<body></body>部分使用<script></script>标签。所以尽量不要用该方法,它使js代码和html代码混在了一块,违背了分离javascript原则。

    innerHTML属性(几乎所有的浏览器都支持该属性)

    用来读写某给定元素里面的HTML内容

    <p id=“para“> 这是一个段落</p>

    用法:  var p=document.getElementById(“para”);

    获取: alert(p.innerHTML);//  将显示     这是一个段落(如果内部含有其他元素,会将其它的元素标签也显示出来,是HTML内容,而不是文本节点内容)

                例如:<p id=“para“><strong> 这是一个段落</strong></p>

    则 p.innerHTML的值为<strong> 这是一个段落</strong>

             设置:  p.innerHTML=”新段落”;

                  p.innerHTML=”<h3>新段落</h3>”

    优点:该方法不用在<body></body>部分使用<script></script>标签就可以使用。

    createElement()方法

    用法:document.create(nodeName);  eg:document.createElement(“p”);

    该方法只能创建元素节点,但不能将元素节点添加到文档中,因此我们需要另外一种方法将创建的节点添加到html文档中去。

    appendChild()方法

    把新创建的节点插入到文档中最简单的方法是,让它成为某一个元素节点的子节点。

    假设向<div id=”mydiv”></div>中添加<p>元素

    用法:parent.appendChild(child);

    var p=document.createElement(“<p>这是一个段落</p>”);

    var div=document.getElementById(“mydiv”);

    div.appendChild(p);

    createTextNode()方法

    添加文本节点,上面新建<p>中为空,因此向<p>中添加一个文本节点。

    用法:  var text=document.createTextNode(“hello world!”);

                  p.appendChild(text);

    insertBefore()方法

    将新元素添加到现有元素的前面

    用法:parentElement.insertBefore(newElement,targetElement);

             需要用到两个元素的父节点,两个元素有共同的父节点。

    DOM并未提供insertAfter()方法。但可以自己编写,思想:比如将A插入到B的后面

    需要用到nextSinling属性(返回某个元素之后紧跟的元素(处于同一树层级中));

    还要用到insertBefore();

    var parent=targeElement.parentNode;

    if(parent.lastChild==targetElement)

       parent.appendChild(newElement);

    else{

           parent.insertBefore(newElement,targetElement.nextSibling);

    }

  • 相关阅读:
    C#基础视频教程5.3 如何编写简单的超级热键
    spring boot中注入jpa时报could not autowire.No beans of 'PersonRepository' type found
    SpringBoot中常用注解@Controller/@RestController/@RequestMapping的区别
    idea如何搭建springboot框架
    Fiddler建好代理后,能连到手机,但手机不能上网了是什么原因
    如何用Fiddler对Android应用进行抓包
    【fiddler】抓取https数据失败,全部显示“Tunnel to......443”
    将excel的数据导入到数据库后都乱码了是怎么回事
    java保存繁体字到数据库时就报错Incorrect string value: 'xF0xA6x8Dx8BxE5xA4...' for column 'name' at row 1
    将爬取的网页数据保存到数据库时报错不能提交JPA,Caused by: java.sql.SQLException: Incorrect string value: 'xF0x9Fx98xB6 xE2...' for column 'content' at row 1
  • 原文地址:https://www.cnblogs.com/sunran/p/3848212.html
Copyright © 2011-2022 走看看