js的间隔延迟以及dom操作

JavaScript的间隔与延迟

间隔  setInterval():

setInterval("函数名",间隔时间)

setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式。

setInterval() 方法会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。

clearInterval(间隔的变量名);

延迟 setTimeout():

;("函数名",间隔时间)

setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式。

JavaScript的DOM操作

1.JavaScript:写入 HTML 输出

实例

document.write("<h1>This is a heading</h1>");

2.JavaScript:对事件作出反应

实例

<button type="button" onclick="alert(‘Welcome!‘)">点击这里 </button>

3.JavaScript:改变 HTML 内容

使用 JavaScript 来处理 HTML 内容是非常强大的功能。

        查找元素:
                根据id获取元素
                document.getElementById("id");
                根据class获取元素
                document.getElementsByClassName("class");
                根据标签名获取元素
                document.getElementsByTagName("div");
                根据name获取元素
                document.getElementsByName("name");  操作内容:
   1.获取对象里的html代码与文字
    获取的对象.innerHTML;  2.获取对象里的文字----兼容有问题    获取的对象.innerText;textContent;          

     3.改变对象里的html代码与文字

  获取的对象.innerHTML="改变的内容";

   4.改变对象里的文字----兼容有问题

  获取的对象.innerText="改变的内容";

表单可进行的特殊操作

1.获取对象的value值

获取的对象.value

操作属性

1.设置一个属性,添加或更改

获取的对象.setAttribute("属性名","属性值")

2.获取属性的值

获取的对象.getAttribute("属性名");

3.移除一个属性

获取的对象.removeAttribute("属性名");

操作样式

1.操作样式

获取的对象.style.样式=”” ;

2.获取样式

Var a = 获取的对象.style.样式

原文地址:https://www.cnblogs.com/zzq123/p/9860650.html

时间: 2024-10-03 13:39:00

js的间隔延迟以及dom操作的相关文章

关于js封装框架类库之DOM操作模块(二)

上一篇基本实现了框架结构,但是与真正能用上的项目框架比较还是存在很多不足,在这又做了些加强与优化 1 (function ( window, undefined ) { 2 3 4 var arr = [], 5 push = arr.push, 6 slice = arr.slice, 7 concat = arr.concat; 8 9 // 构造函数 10 var YY = function YY ( selector ) { 11 return new YY.fn.init( selec

关于js封装框架类库之DOM操作模块(一)

在前端开发的过程中,javascript极为重要的一个功能就是对DOM对象的操作,而对其封装就是为了更好地进行DOM操作,提高浏览器的支持效率 现在给出一个案例:页面创建三个div,然后给其添加样式 1.第一种方法 //第一种方法 var i, node; for ( i = 0; i < 3; i++ ) { node = document.createElement( 'div' ); node.setAttribute( 'class', 'c' ); //node.className =

JS中的BOM以及DOM操作

screen:对象 console.log(screen.width);//屏幕宽度   console.log(screen.availHeight);//可用高度=屏幕高度-底部任务栏   console.log(screen.height);//屏幕高度   console.log(screen.availWidth);//可用宽度 location对象    *     * 完整的URL路径:    * 协议://主机名(IP地址):端口号/文件路径?传递参数(name1=value1&

JS中的事件以及DOM 操作

[DOM树节点] DOM节点分为三大节点:元素节点,文本节点,属性节点. 文本节点,属性节点为元素节点的两个子节点通过getElment系列方法,可以去到元素节点 [查看节点] 1 document.getElementById("div1")  通过ID获取唯一的节点  多个同名ID只会取到第一个 2 getElmentsName   通过Name取到一个数组,包含1到多个节点   使用方式   通过循环,取到每一个节点  循环次数从0开始,<数组 length [查看和设置属

将原生JS和jquery里面的DOM操作进行了一下整理

创建元素节点 1.原生: document.createElement("div") 2.jquery: $("<div></div>") 创建文本节点并加入元素节点中 1.原生: var text=document.createTextNode("文本内容"); var p=document.createElement("p"); p.appendChild(text); 2.jquery: var 

原生JS实现几个常用DOM操作API

原生实现jQuery的sibling方法 <body> <span>我是span标签</span> <div>我是一个div</div> <h1 id="h1">我是标题</h1> <p>我是一个段落</p> <script type="text/javascript"> //获取元素的兄弟节点 function siblings(o){//参数o

JS中的DOM对象及JS对document对像的操作

DOM对象 windows:属性:opener(打开者) 方法:open().close(),setTimeout().setInterval()... location:属性:href 方法:reload()刷新 history:方法:go() status:不常用 document:下面详细介绍 JS对document对像的操作 分两个: 找到对象.操作对象. 找到对象的方法:document.getElementById().document.getElementsByName(). do

认识JQuery,JQuery的优势、语法、多库冲突、JS原生对象和JQuery对象之间相互转换和DOM操作,常用的方法

(一)认识JQuery  JQuery是一个JavaScript库,它通过封装原生的JavaScript函数得到一套定义好的方法    JQuery的主旨:以更少的代码,实现更多的功能 (二)JQuery的优势 1)可以像CSS一样访问和操作DOM 2)修改CSS控制页面外观 3)简化JS代码操作 4)事件代理更加容易 5)动画效果使用方便 6) Ajax技术更加完美 7)大量的基于Jquery的插件 8)可以自定义扩展功能插件 (三)JQuery的语法 格式:$(selector).actio

js,jQuery和DOM操作的总结(二)

jQuery的基本操作 (1)遍历键值对和数组 var arr = [9, 8, 7, 6, 5, 4]; $.map(arr, function (ele, index) { alert(ele + '===' + index); //第一个参数是数组里面的值,第二个参数是索引 }) //=========================================// var keyWord = { "name": "老牛", "age"