js是一种脚本语言。在html中起到操控行为的作用。在html中,html代码如果是一个人的话,那么js就是这个人的行为

js在html的head中被引用,也可以在body中被引用。引用方式用<script></script>标签:<script src="public.js" type="text/javascript"></script>

放在head和body中的区别:因为h'tml代码在解析时,是按顺序从上倒下运行的。如果放在head中,就会先执行js,js执行忘了才会继续body中的html,显示在页面。所以这种情况下,我们打开页面会先看见长时间的空白。因为正在加载js.用户体验不好。。而如果放在body中。在执行时,先执行body中的html代码,将页面先呈现在用户面前, 最后执行到js时,js可以在后台慢慢加载。用户体验比较好

一、字符串操作

//定义字符串
var str = '你开心就好!';
var name = 'aaaaaa';
// 字符串的拼接
var name_str = name+str;
//字符串操作
str = 'aaaaajijiji'
str.charAt(0) 根据角标获取字符串中的某一个字符 char字符
str.substring(1,3) 根据角标获取 字符串子序列 大于等于x 小于y
str.length 获取字符串长度
str.concat('第一个字符串') 拼接字符串
str.indexOf('大师') 获取子序列的位置
str.slice(0,1) 切片 start end
str.toLowerCase() 变更为小写
str.toUpperCase() 变更大写
str.split('师',1) 切片 返回数组 参数2 为取分割后数组的前x个元素 数字类型(JavaScript 只有一种数字类型。数字可以带小数点,也可以不带) var age = 18;
var score = 89.22;
number = '';
// 字符串转
var n = parseInt(number); //如果number带小数点,则会直接去掉小数点后内容
// 转换成小数
f =parseFloat(number)
布尔类型(true 或 false)
var t = true; var f = false;//python中都是大写的,js中都是小写的

二、数组

// 第一种创建方式 var list = new Array();
list[0] = '第一个元素';
list[1] = '第二个元素'; // 第二种创建方式
var list2 = new Array('第一个元素','第二个元素'); // 第三种创建方式
var list3 = ['第一个元素','第二个元素']; 数组操作 list3.length 数组的长度 list3.push('dsx') 尾部追加参数 list3.shift() 头部获取一个元素 并删除该元素 list3.pop() 尾部获取一个元素 并删除该元素 list3.unshift('dsx') 头部插入一个数据 list3.splice(start, deleteCount, value) 插入、删除或替换数组的元素 list3.splice(n,0,val) 指定位置插入元素 list3.splice(n,1,val) 指定位置替换元素 list3.splice(n,1) 指定位置删除元素 list3.slice(1,2) 切片; list3.reverse() 反转 list3.join('-') 将数组根据分割符拼接成字符串 list3.concat(['abc']) 数组与数组拼接 list3.sort() 排序

三、对象

类似python中的字典

var dict = {name:'dsx',age:18,sex:'男' };
var age = dict.age; //通过key,获取到value
var name = dict['name'];
delete dict['name'] 删除
delete dict.age 删除

四、循环

//        if(1==2){
// console.log(1111111)
// }
// else if(2==2){
// console.log(2222)
// }
// else{
// console.log('最后了')
// } //javascript当中如果是两个等号,代表不去校验数据类型是否相同.三个等号会判断数据类型
// if ('1'==1){
// console.log(11111)
// }
// 以上代码会打印出11111 if('1'===1){
console.log(1111111)
}
else{
console.log(222222)
}
// 以上代码会打印出222 //switch
switch(2){
case 1:
console.log(1111);//多行代码的情况,必须加上分号
break;//每个分支都必须加break
case 2:
console.log(22222);
break;
default:
console.log(33333) } // for循环--字符串
var name='dsx nhy';
for(var a in name){//循环的是角标,0,1,2,3.。。
console.log(name[a])
}
// 数组,循环的还是角标
var list=['大师兄','怒牛','andas'];
for(var i in list){
console.log(list[i])
}
//字典,循环的是key
var dict={'宝马':'BMW','奔驰':'bc'};
for (var d in dict){
console.log(d);
console.log(dict[d])
} // 下面这种方法,不支持字典的循环
var list=['大师兄','怒牛','andas'];
for(var i=1;i<=list.length;i++){
console.log(i);
console.log(list[i])
} // while循环
while(1==1){//死循环
console.log(111111)
}

五、函数

//        常规函数
function f(name,age){//可传参,也可不传
console.log(name);
console.log(age); }
f('dsx',19)// 自执行函数
(function (name) {
console.log('自执行函数') })('实参name')
//相当于先(function()),function函数外层括号成一个变量f,然后变量f后加上括号,可以自动执行f().等同下面代码
// f=(function(){console.log('fdfd')});
// f()

六、对象

通过new关键字创建对象

在js中,方法和类的区别在于是否有this.如果方法用到了js,将自动解析为类

<script>
function f(name) {
this.name=name;//函数中写了this,js就自动将函数当作一个类。this等同python中的self
this.say=function(){//匿名函数
console.log('say'+this.name)
} }
var obj=new f('dfdf');//通过new创建对象
console.log(obj.name);
obj.say()
</script>

html基础:js的更多相关文章

  1. js基础 js自执行函数、调用递归函数、圆括号运算符、函数声明的提升 js 布尔值 ASP.NET MVC中设置跨域

    js基础 目录 javascript基础 ESMAScript数据类型 DOM JS常用方法 回到顶部 javascript基础 常说的js包括三个部分:dom(文档document).bom(浏览器 ...

  2. 前端基础------JS

    JS中的语句要以分号 ;  为结束符. JS语言基础: 1, JS 的变量名可以使用 下划线, 数字, 字母, $ 组成. 不可以是数字开头 2, 声明变量使用var 变量名. 的格式来进行声明. v ...

  3. HTML基础--JS简介、基本语法、类型转换、变量、运算符、分支语句、循环语句、数组、函数、函数调用.avi

    JS简介 1.JavaScript是个什么东西? 它是个脚本语言,需要有宿主文件,它的宿主文件是HTML文件. 2.它与Java什么关系? 没有什么直接的联系,Java是Sun公司(已被Oracle收 ...

  4. Javascript 基础--JS函数(三)

    一.基本概念:未完成某一个功能的代码(语句,指令)的集合. 二.函数的调用方式: 2.1.函数名(传递参数1,传递参数2)   基本语法 function 函数名(参数列表){ //代码; retur ...

  5. JavaScript基础知识----零基础js入门练习题

    1,什么是Javascript? 答:Javascipt是一种脚本语言,由web浏览器进行解释和执行.   2,JavaScript是由那几个部分组成?  答:主要分为以下三种:     ECMASc ...

  6. Javascript基础 - js中曾经忽略的知识点

    深入那些曾经忽略的Javascript知识 1. parseInt(string, [radix]),parseFloat(string) 一般我们省略第二个参数,parseInt(‘100’) == ...

  7. JS基础-----JS中的分支结构及循环结构

    [分支结构] 一.if-else结构 1.结构的写法:if(判断条件){ //条件为true时,执行if的{} }else{ //条件为false时,执行else的{} } 2.注意事项 ①else语 ...

  8. html基础js

    HTML中的三把利器的JS 又称为JavaScript,看着好像和Java有点联系,实际上他和java半毛钱关系都没有,JavaScript和我们学习的Python.Go.Java.C++等,都是一种 ...

  9. 自测 基础 js 脚本。

    <html> <head> <script> //function(<text>a{[]}lert('x')</text>)() docum ...

  10. 前端小例子 基础js css html练习

    前情提要: 学前端也有一阵了,个人感觉前端还是重要的. html 学习教程 https://www.cnblogs.com/baili-luoyun/p/10466040.html css 教程 js ...

随机推荐

  1. AlgorithmMan,一套免费的算法演示神器

    概述 该文章的最新版本已迁移至个人博客[比特飞],单击链接 https://www.byteflying.com/archives/971 访问.  文章末尾附带GitHub开源下载地址. 0.概述 ...

  2. C#LeetCode刷题之#657-机器人能否返回原点(Robot Return to Origin)

    问题 该文章的最新版本已迁移至个人博客[比特飞],单击链接 https://www.byteflying.com/archives/3959 访问. 在二维平面上,有一个机器人从原点 (0, 0) 开 ...

  3. Vue 给页面加水印指令(directive)

    页面需要水印 import Vue from 'vue' /** * watermark 指令 * 解决: 给页面生成水印 * 基本原理:给选择器添加背景图片 * 用法:v-watermark=&qu ...

  4. 9个常用ES6特性归纳(一般用这些就够了)

    ECMAScript 6.0(以下简称 ES6)是 JavaScript 语言的下一代标准,已经在 2015 年 6 月正式发布了.它的目标,是使得 JavaScript 语言可以用来编写复杂的大型应 ...

  5. 最后之作-Last Order(bushi

    最近化学学有机选修,讲羧酸的时候我想到一个问题:不考虑空间异构.能否稳定存在等问题,某高级饱和脂肪酸有多少种同分异构体?做为一名退役的OIer,我将它抽象为了另一个问题:含\(n\)个\(C\)的饱和 ...

  6. equals&hashCode

    经典规则:如果重写了equals,必须重写hashCode 为什么??? 这个规则考虑的应用场景:如果你的对象可能放入HashMap,HashSet,不重写会出问题 问题场景: new一个对象,重写了 ...

  7. SparkStreaming支持的业务场景

    目前而言SparkStreaming 主要支持以下三种业务场景: ➢ 无状态操作:只关注当前的DStream中的实时数据.例如:只对当前DStream中的数据做正确性校验.(下一条与上一条数据无关) ...

  8. keepalived的vrrp多播报文被禁,导致VIP同时位于多个机器上

    keepalived的vrrp多播报文被禁,导致VIP同时位于多个机器上 查看man keepalived.conf,VRRP instances中给出了单播的设置方法,添加unicast_peer即 ...

  9. AltiumDesigner20画图不求人10 | 提高AD20启动速度的方法六取消加入产品改善计划 | 视频教程 | 你问我答

    教程内容:AltiumDesigner20画图不求人系列,是电子芯原创的AltiumDesigner绘图技巧视频教程,每一个技巧只需要不到3分钟的时间就可以完成学习.前期经过AD19的画图不求人,帮助 ...

  10. Java 将Html转为PDF

    本文介绍如何在Java程序中将html文件转换成PDF文件.转换时,需要注意以下两点: 一.需要使用转换插件 可根据不同的系统来下载对应的插件,下载地址:windows-x86.zip, window ...