1、alert()
alert('输出内容')
用于弹出一个警告框,确保用户可以看到某些信息。
2、console.log()
浏览器调试控制台运行js
console.log('输出内容')
用于在浏览器的控制台中输出内容。
console.log('Hello world')
console.log(123)
console.log(true)
var greeting = 'Hello'
console.log(greeting)
console.log([1, 2, 3, 4]) //数组
console.log({ a: 1, b: 2 }) //对象
//使用表格输出对象
console.table({ a: 1, b: 2 });
//报错
console.error('this is some error');
// 清空
//console.clear();
//警告
console.warn('this is a warning');
3、innerHTML和innerText
获取内容或给获取到的元素设置⼀些内容
document.getElementById('id名').innerHTML='内容'
从以上例子可以看出:
innerHTML
设置或获取标签所包含的HTML
+文本信息(从标签起始位置到终止位置全部内容,包括HTML
标签,但不包括自身)innerText
设置或获取标签所包含的文本信息(从标签起始位置到终止位置的内容,去除HTML
标签,但不包括自身)outerHTML
设置或获取标签自身及其所包含的HTML
+文本信息(包括自身)outerText
设置或获取标签自身及其所包含的文本信息(包括自身)
innerText
和outerText
在获取的时候是相同效果,但在设置时,innerText
仅设置标签所包含的文本,而outerText
设置包含包括标签自身在内的文本。
innerHTML
所有浏览器都支持。
区别:
innerHTML
、outerHTML
在设置标签之间的内容时,包含的HTML会被解析;而innerText
、outerText
则不会;innerHTML
、innerText
仅设置标签之间的文本,而outerHTML
、outerText
设置包含自身标签在内文本
4、document.write()
document.write('输出内容')
用于在HTML文档页面中输出内容。在js中使用得比较少。
效果如下:
可以看出,document.write()
会解析内容中含有的HTML
标签。
给“重写
”div设置一个单击事件如下:
单击“重写
”div
效果如下:
可以看到,输出内容会清空原有的html再⽣成⼀个新的html
。document.write()
重写⽂档是发⽣在⽂档加载完成后,对页面进行一些动作,触发事件等。
5、prompt()
弹出一个输入框,提示用户输入内容,返回用户输入的内容或缺省值或null。
var name = prompt("请输入姓名:",'匿名');
alert(name);
第1个参数设置提示信息,第2个参数用于设置弹出的输入框中的默认文本。