JS中常用的输出方式(五种)_javascript技巧

废话不多少了，直接给大家上干活了，具体详情如下所示：

1、alert("要输出的内容");

->在浏览器中弹出一个对话框,然后把要输出的内容展示出来

->alert都是把要输出的内容首先转换为字符串然后在输出的

2、document.write("要输出的内容");

->直接的在页面中展示输出的内容

3、console.log("要输出的内容");

->在控制台输出内容

4、value ->给文本框(表单元素)赋值内容

->获取文本框中(表单元素)的内容

document.getElementById("search").value = "要给#search这个文本框添加的内容";

5、innerHTML/innerText ->给除了表单元素的标签赋值内容

document.getElementById("div1").innerHTML = "吧啦吧啦吧啦吧啦";
document.getElementById("div1").innerText = "吧啦吧啦吧啦吧啦";

->innerHTML和innerText的区别

1)innerHTML在赋值的时候,如果遇到了有效的HTML标签会把它当做真正的标签处理,标签就可以起到自己的作用了；

innerText不管是不是标签都当做文本来赋值，那么看到的都是文本，标签起不到自己的作用；

(在赋值的时候innerHTML可以识别HTML标签，而innerText不能识别)

2)在部分火狐浏览器中，不支持innerText,而innerHTML是所有浏览器都支持的

时间： 2024-04-27 07:09:52

JS中常用的输出方式(五种)_javascript技巧的相关文章

js中常用的Tab切换效果(推荐)_javascript技巧

如下所示: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>tab</title> <style> *{margin:0; padding:0; list-style:none;} .box{ width: 1000px; overflow: hidden; margin:100px auto

JavaScript中定义类的方式详解_javascript技巧

本文实例讲述了JavaScript中定义类的方式.分享给大家供大家参考,具体如下: Javascript本身并不支持面向对象,它没有访问控制符,它没有定义类的关键字class,它没有支持继承的extend或冒号,它也没有用来支持虚函数的virtual,不过,Javascript是一门灵活的语言,下面我们就看看没有关键字class的Javascript如何实现类定义,并创建对象. 一.定义类并创建类的实例对象 在Javascript中,我们用function来定义类,如下: function Sh

JavaScript事件处理的方式(三种)_javascript技巧

一.什么是JavaScript事件? 事件(Event)是JavaScript应用跳动的心脏,也是把所有东西粘在一起的胶水,当我们与浏览器中Web页面进行某些类型的交互时,事件就发生了. 事件可能是用户在某些内容上的点击.鼠标经过某个特定元素或按下键盘上的某些按键,事件还可能是Web浏览器中发生的事情,比如说某个Web页面加载完成,或者是用户滚动窗口或改变窗口大小.说白了,事件是文档或浏览器中发生的特定交互瞬间! 通过使用JavaScript,你可以监听特定事件的发生,并规定让某些事件发生以对这

js中获取事件对象的方法小结_javascript技巧

复制代码 代码如下: var evt = window.event || arguments[0]; 下面分三种添加事件的方式讨论,你也许会看到以前没有看到过的获取方式. 1,第一种添加事件的方式,直接在html的属性中写JS代码 复制代码 代码如下: <div onclick="alert(4);">Div1 Element</div> 大概这是上世纪90年代的写法,那时候直接把js代码写在网页中很普遍,也许那时候的js并不太重要,只是用来做做验证或一些花哨的

一道优雅面试题分析js中fn()和return fn()的区别_javascript技巧

在js中,经常会遇到在函数里调用其它函数的情况,这时候会有 fn() 这种调用方式,还有一种是 return fn() 这种调用方式,一些初学者经常会被这两种方式给绕晕了.这里用一个优雅的面试题来分析一下两种方式的不同之处.  var i = 0; function fn(){ i++; if(i < 10){ fn(); }else{ return i; } } var result = fn(); console.log(result); 这是一道隐藏了坑的面试题,看似很简单,大部分人可能想

详解js中的apply与call的用法_javascript技巧

前言 call 和 apply 都是为了改变某个函数运行时的 context 即上下文而存在的,换句话说,就是为了改变函数体内部 this 的指向.call 和 apply二者的作用完全一样,只是接受参数的方式不太一样. 方法定义applyFunction.apply(obj,args)方法能接收两个参数: obj:这个对象将代替Function类里this对象 args:这个是数组或类数组,apply方法把这个集合中的元素作为参数传递给被调用的函数. call call方法与apply方法的第

JS中位置与大小的获取方法_javascript技巧

scrollHeight,clientHeight,offsetHeight的区别 说明: scrollHeight:DOM元素的实际内容的高度,不包border的高度,会随DOM元素中内容的增加(超过可视区后)而变大. clientHeight:DOM元素内容可视区的高度,不包含滚动条和边框的高度. offsetHeight:DOM元素整体的高度,包括滚动条和边框. 当滚动条不出现的时候 这时候DOM元素中没有内容或者内容不超过可视区 scrollWidth=clientWidth,两者皆为可

js中 javascript:void(0) 用法详解_javascript技巧

javascript:void(0)表示不做任何动作.如: 复制代码 代码如下: <a href="javascript:void(0);" onclick="alert('ok');"></a>  这里表示这个链接不做跳转动作,执行onClick事件. 我想使用过ajax的都常见这样的代码: 复制代码 代码如下: <a href="javascript:doTest2();void(0);">here<

JS中数组Array的用法示例介绍_javascript技巧

new Array() new Array(len) new Array([item0,[item1,[item2,...]]] 使用数组对象的方法: var objArray=new Array(); objArray.concact([item1[,item2[,....]]]-------------------将参数列表连接到objArray的后面形成一个新的数组并返回,原有数组不受影响.如:var arr=["a","b","c"];