js的基础知识与书写位置
js:全称JavaScript,主要作用:控制网页的行为,用于实现网页和用户之间的一些交互效果。
学习js是要分为3个部分学习的。
1.ECMAScript:简称ES,他规定了js的语法规则。
2.BOM:browser object model,叫做浏览器对象模型,他提供了一套可以操作浏览器的属性和方法(只要是css不可调整的部分就属于浏览器部分,比如浏览器的滚动条,标签页、地址栏、关闭按钮、刷新按钮、前进按钮、回退按钮等等,以后想利用js控制这些部分,就需要利用BOM的知识点。)
3.DOM:document object model,叫做文档对象模型,他提供了一套可以操作文档流的属性和方法(也就是css可以调整的都属于文档流的部分,都需要DOM的知识点去完成)
书写位置:(1)行内式.(2)内嵌式/内部(3)外部/外链式
<1>行内式:与css的行内式相似不推荐这种方式,因为这种方式让js代码和标签书写在一起,不利于代码的阅读和维护。一般在body或者head的末尾写。
例如在a标签中的书写格式
<!-- 在a标签中的书写形式 -->
<a href="javascript:js代码的书写位置;">11</a>
在非a标签中的书写形式需要加一个行为属性再写js代码例如:
<!-- 在非a标签中的书写形式 -->
<div onclick="alert('111')">111</div>
“alert”是一个打印/输出语句
<2>内嵌式/内部:需要在html页面种创造一个叫做script的标签,标签中间就是书写js代码的地方。script标签可以书写在文件的任何一个位置,但是我们一般推荐写在head或者body代码的末尾。
1.script标签中写的js代码网页一打开就会立即执行
2.标签可以书写多个,按照从上到下顺序依次执行。
示例:
<body>
<script>
alert(1111)
</script>
</body>
<3>外链式(外部)
需要单独创建一个后缀名为.js的文件,然后再通过 <script src="路径"></script>引入
1.网页一打开代码就会立即执行
2.一旦script带了src属性就变成外部的引入方式了,script标签中就不能再书写js代码.
示例:
<body>
<!-- 引入了外部js文件 -->
<script src="">
alert('2222')
</script>
</body>
注意这里打开页面什么都不显示,alert不起作用因为这是外部式,只能在.js文件里写内容。
js中常用的输出语句
(1)alert('输出内容')
<body>
<script>
alert('我是alert语句')
alert(1111)
alert('<h1>我是通过js写的h1</h1>')
</script>
</body>
alert语句的括号中如果是数字或者变量名可以不加单引号,括号中也可以写标签例如h1标签,但是标签中默认的属性不会显示例如加粗字号等。
(2)console.log('输出的内容'):
<body>
<script>
console.log('我是console.log语句');
console.log(111);
console.log('<h1>我是通过js写的h1</h1>');
</script>
</body>
console语句在打开网页时不能直接显示,需要配合检查工具(f12)里面的Console来进行查看。
(3)document.write(输出的内容):直接把输出内容显示在网页上,可以识别输出语句中的标签。
<body>
<script>
document.write('我是document的输出内容')
document.write(1111)
document.write('<h1>我是通过js写的h1</h1>')
</script>
</body>