溢出属性、定位属性、js数据类型,数值型字符型内置方法
作者:互联网
溢出属性
结构:
overflow:visible/hidden /scroll/auto/inherit
具备的功能:
visible:默认值,内容不会被修剪,会呈现在元素框之外
hidden:内容会被修剪,并且其余内容是不可见的
scroll:内容会被修剪,但是浏览器会显示滚动条,以便查看其余的内容
auto:如果内容被修剪,则浏览器会显示滚动条
inherit:规定应该从父元素继承overflow属性的值,(ie浏览器不支持此属性值 )
定位属性position
定位的状态
1.静态定位 static
所有的标签默认都是静态定位即不能通过定位操作改变位置
2.相对定位 relative
相对于标签原来的位置做定位
3.绝对定位 absolute
相对于已经定位过的父标签做定位
absolute 定位使元素的位置与文档流无关,因此不占据空间。
absolute 定位的元素和其他元素重叠。
4.固定定位 fixed
相对于浏览器窗口做定位
定位操作
position static/relative/absolute/fixed
left\right\top\bottom:XXpx
z-index属性
'''动态弹出的分层界面 我们也称之为叫模态框'''
元素的定位与文档流无关,所以它们可以覆盖页面上的其它元素
z-index属性指定了一个元素的堆叠顺序(哪个元素应该放在前面,或后面)
一个元素可以有正数或负数的堆叠顺序:
具有更高堆叠顺序的元素总是在较低的堆叠顺序元素的前面。
注意: 如果两个定位元素重叠,没有指定z-index,最后定位在HTML代码中的元素将被显示在最前面。
JavaScript简介
JavaScript 是一种轻量级的编程语言。
JavaScript 是可插入 HTML 页面的编程代码。
JavaScript 插入 HTML 页面后,可由所有的现代浏览器执行。
JavaScript 很容易学习。
# 3.JS最初由一个程序员花了七天时间开发的 里面存在很多bug
为了解决这些bug一直在编写相应的补丁 补丁本身又有bug 最后导致了js中有很多不符合逻辑的地方(成了大家墨守成规的东西)
# 4.JavaScript与ECMAScript
JavaScript原先由一家公司开发 希望其他公司都使用 最后被组织改名
# 5.版本问题
ECMA5
ECMA6
js注释
# 注释语法
// 单行注释
/*多行注释*/
# 结束符号
分号结束 console.log('hello world');
变量声明
在js中定义变量需要使用关键字声明
1.var
var name = 'tuzi'
2.let
let name = 'tuzi'
'''var声明都是全局变量 let可以声明局部变量'''
js里面室友常量的:
常量声明:
const pi = 3.14
数据类型
查看数据类型的方式
# typeof
typeof + 变量/常量名
用法:
数值类型(相当于python里面的整型int和浮点型float)
Number
NaN:属于数值类型 意思是'不是一个数字'(not a number)
parseInt('abc') 不报错返回NaN
parseFloat('abc')不报错返回NaN
用法:
字符类型(相当于python里面的字符串str)
# 类型名:String
默认只能是单引号和双引号
var name1 = 'tuzi'
var name2 = "tuzi"
格式化字符串小顿号
var name3 = `tuzi`
# 如果格式化的事多行文本,那有换行符就会自动加上\n
字符类型之字符的拼接
js中推荐使用加号
1 = 'tuzi'
var name2 = 'NB'
var name3 = name1+name2
console.log(name3)
# 输出结果 VM1066:1 tuziNB
字符类型之统计长度
js中使用length python中使用len()
var name = 'tuzi'
undefined
name.length
# 输出结果 4
字符类型之移除空白(不能指定)
js中使用trim()、trimLeft()、trimRight()
python中使用strip()、lstrip()、rstrip()
var s1 = ' 123 '
s1.trim()
# 结果:'123'
字符类型之切片操作
js中使用substring(start,stop)、slice(start,stop)
前者不支持负数索引后者支持
python中使用[index1:index2]
# substring用法:
var s2 = 'tuzi is shuibi'
undefined
s2.substring(1,6)
# 结果:'uzi i'
s2.slice(-4,-1)
# 结果:'uib'
字符类型之大小写转换
js中使用.toLowerCase()、.toUpperCase()
python中使用lower()、upper()
# 用法:
s2.toLowerCase()
'tuzi is shuibi'
s2.toUpperCase()
'TUZI IS SHUIBI'
字符类型之字符串的格式化
js中使用格式化字符串(小顿号)
var name = 'tuzi'
var age = 18
console.log(`
my name is ${name} my age is ${age}`)
# my name is tuzi my age is 18
python中使用%或者format
字符类型之布尔类型(相当于python中的布尔值bool)
Boolean
js中布尔值是全小写
true false
布尔值为false的 0 空字符串 null undefined NaN
python中布尔值时首字母大写
True False
布尔值为False的 0 None 空字符串 空列表 空字典...
"""
null的意思是空 undefined的意思是没有定义
"""
对象(相当于python中的列表、字典、对象)
数组Array(相当于python中的列表)
var l1 = [11, 22, 33]
追加元素
js中使用push() python中使用append()
l1.push(44)
console.log(l1)
VM2459:1 (4) [11, 22, 33, 44]
弹出元素
js和python都用的pop()
# 尾部弹出
l1.pop(22)
console.log(l1)
VM2509:1 (3) [11, 22, 33]
头部插入元素
js中使用unshift() python中使用insert()
l1.unshift
l1.unshift(55)
console.log(l1)
VM2591:1 (3) [55, 11, 22,33]
头部移除元素
js中使用shift() python中可以使用pop(0) remove()
l1.shift(55)
console.log(l1)
VM2633:1 (2) [11, 22]
扩展列表
js中使用concat() python中使用extend()
l1.concat(44,55)
(4) [11, 22, 33, 44, 55]
foreach
forEach() 方法用于调用数组的每个元素,并将元素传递给回调函数。
注意: forEach() 对于空数组是不会执行回调函数的。
'''
forEach方法中的function回调有三个参数:
第一个参数是遍历的数组内容,
第二个参数是对应的数组索引,
第三个参数是数组本身
'''
var l2 = ['jason', 'tony', 'kevin', 'oscar', 'jerry']
l2.forEach(function(arg1){console.log(arg1)})
VM3143:1 jason
VM3143:1 tony
VM3143:1 kevin
VM3143:1 oscar
VM3143:1 jerry
标签:定位,python,元素,数据类型,tuzi,js,var,属性 来源: https://www.cnblogs.com/zhengkaijian/p/16201187.html