javascript四种引入调用方法

1、javascript四种引入调用方法、js基础语法-定义变量、变量输出

（1）第一种方法：嵌入式脚本，在body标签最后加上script

<script> // JS脚本中 = 是赋值符号，把右侧的数据存放在左侧 // js脚本中'' "" ``在这里包裹着的内容叫做字符串 document.title='下雪'; // 通过js脚本，去修饰页面中的body，给他添加行内样式，设置背景颜色为蓝色 document.body.style.backgroundColor='lightblue'; // 抓取对象 var w = document.getElementById('w'); console.log(w); // 修饰对象--行内样式 w.style.backgroundColor="pink"; w.style.fontSize="50px"; w.style.color='#fff'; var box=document.getElementById('box'); // 可以向节点放置文本内容、html标签 box.innerHTML = '测试'; function run(){ // 跳转 window.location.href='https://www.baidu.com/'; } </script>

（2）第二种方法：引入外部脚本文件

<script src="js/index.js"></script>

（3）第三种方法：将js脚本写在节点里

<!-- href="javascript:;"禁止刷新 --> <a href="javascript:;" onclick="run()">百度</a> <a href="javascript:;" onclick="window.location.href='https://www.baidu.com'">百度</a>

（4）第四种方法：form

<!-- onsubmit="return checked()" 点击，提交，跳转到这checked方法里， 去检查用户输入的数据 合不合法。 --><form action="javascrip:;" onsubmit="return checked()"><p><label for="">用户名：</label><input type="text" name="uname" id="uname" value=""></p><p><input type="submit" value="提交"><input type="reset" value="重置"></p></form>

2、变量的申明方式

// 1.先申明后赋值 var t1,t2; t1='test1'; t2='test2'; // 2.申明和赋值同时进行 var age = 19; var sex = '男'; // 3.一次申明多个变量同时进行赋值 var a =1 ,b=2; // 变量可以计算，可以与字符串进行连接 var r=a+b*b; console.log(r); document.write('姓名：'+t1+'。性别：'+sex+'。年龄：'+age+'。'); document.write('<br/>'); document.write('姓名：'+t1+'。性别：'+sex+'。年龄：'+age+'。');

3、变量的命名规范：

// 1变量名不能以数字开头 var t1 = 'test'; // 2严格区分大小写 // 3.不能用关键词或者保留字命名 // var var = 100; // var if = 100; // 4.javascript自己命名的习惯 // 驼峰命名法：getElementById // 字母大写：Object

4、输出工具和定义变量以及变量的特点

window.onload()

window.onload()是窗口（页面）加载事件。当文档内容完全加载完成会触发该事件（包括图像，脚本文件，css文件等），就调用的处理函数。

注意：

1).window.onload()只能写一次，如果有多个，会以最后一个window.onload为准。

2).window.onload() 一般写在head标签里

（1）控制台输出

console.log(100+2);

代码演示：

（2）document.write()：输出到页面，会以html的语法解析里面的内容。

注意：write() 这个方法里，可以写html标签，可以生效！

document.write('<h1>下午好</h1>');

代码演示：

（3）弹出警告框alert()

window.alert() 弹出警告框显示数据,会以"文本的原格式"输出。Markup

window.alert('你好');

代码演示：

注意：

1). window.alert() 在这里不要写html标签，因为弹出警告框显示的数据,会以"文本的原格式"输出。

2.document.write()：输出到页面，会以html的语法解析里面的内容。

3.console.log() 向控制台输出一条消息。

如：Markup

window.alert('<b>你好</b>');

代码演示：

（4）window.confirm()

window.confirm() 用于“显示一个带有指定消息和确认及取消按钮” 的对话框。

当你点击确认按钮的时候，你可以接受到 true 真这个布尔值

当你点击取消按钮的时候，你可以接受到 false 假这个布尔值Markup

var r = window.confirm('你确认删除这条数据吗？') console.log(r);

代码演示：

当点击确定时，控制台的输出为：

当点击取消时，控制台的输出为：

（5）window.prompt()

window.prompt() 用于“显示可提示用户进行输入”的对话框。

prompt(“提示文字”,“默认值”) 输入框。

注意：.prompt() 弹出的对话框里的用户输入内容的地方，叫单行文本框。

这个单行文本框里的内容，是一个字符串类型的数据。

var uname = window.prompt('请输入你的姓名','test'); console.log(uname);