javascript入门基础篇重点第五节_math.ceil(math.random() * 3600)-优快云博客

本文链接：https://blog.youkuaiyun.com/qq_34187029/article/details/52914747

数字相关方法（toString()/toFixed()、Math对象、parseInt等解说）

数字相关的方法：
number.toString( x ) //x 进制的字符串
number.toFixed( x ) //保留 x 位小数
Math.random() // [0,1) 的随机数如何求某个范围内的随机数呢？
Math.abs(number) //绝对值
Math.ceil(number) //向上取整(有小数，小数不是0整数就加1)
Math.floor(number) //向下取整(舍去小数剩整数)
Math.round(number) //四舍五入
Math.min( 多个参数 ) //参数中的最小值
Math.max( 多个参数 ) //参数中的最大值
parseInt(string) //强制取整
parseFloat(string) //强制取数字(包含小数)
Number() //true与false变成1和0 null是0

例如：

Math 数学函数
console.log(Math.random());//[0,1)
如何获取10-30直接的随机数？
console.log(getRandom(20,30));
function getRandom(start,end){
return Math.random()*(end-start)+start;---->取某个范围内随机数公式start为开始数end为范围结束数
}
41
console.log(Math.floor(23.0));//向下取整
console.log(Math.ceil(23.0001));//向上取整
console.log(Math.round(23.53));//四舍五入取整
console.log(Math.abs(-34));//取绝对值

xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx

JSON对象解说与for in遍历讲解（更深层次理解 [ ] 的使用）

JSON与for in循环：
var json = {name:”Kery”,age :18}
var json2 = {“name”:”Kery”,”age”:18}

for in 遍历：(可以获取对象里面的所有属性和值)
for(var key in document){
console.log(key+”===”+document[key]);
}

注意：[]里面的内容必须是一个字符串！

什么是json? 是对象(object)中的一种
var json = {
"name":"Kery", 其中name,age,asy为key键而kery,18,function(){};为value值并且键在后台传输数据的时候，就
"age":18, 必须打""，使其变为字符串，可以通过[]拿到它的值
"say":function(){ 例如：console.log(json["say"]());并且在[]号后面添加()号使"say"里面函数执行

alert(1);
},
};

例如：
console.log(JSON.stringify(json)+"-===-"+typeof json);
根据json对象中的键获取值
console.log(json.name+"=="+json.age+"==="+json.say());

能不能够获取对象里面的所有属性值呢？ for in遍历
for(var key in json){//josn为要遍历对象id名

console.log(key+"===="+json.key);x错误

console.log(key+"===="+json[key]);------->结果：打印里面josn里面函数所有的字符
} |

拿到josn里面的value值，不能用josn.key，因为这样拿到是名字为key的键而不是value值，然而josn里面并没有名字为key的键所以返回undefind

for(var key in document){
document.write(key+"==="+document[key]+"<br/>");
}

封装id和css样式

function $(id){

return document.getElementById(id);

}

使用：$("xxx")

封装css样式封装为css({},obj)

function css(json,obj){ obj为要的对象的id名

for(var key in obj) {

obj.style[key]=josn[key];

| |

key键(css属性) value(css属性设置的值)

}

};

使用：css({

width:"100px",

height:"100px",

background:"yellow",

},xxx)其中xxx改变css样式id名

xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx

获取对象节点样式值（主流浏览器与IE6,7,8获取样式的兼容问题）

如何获取元素节点的样式？
.style 只能获取内联样式，其他样式怎样获取？
getComputedStyle(obj).attr; IE9+
obj.currentStyle.attr IE6,7,8做了兼容

getComputedStyle是一个可以获取当前元素所有最终使用的CSS属性值。返回的是一个CSS样式声明对象([object CSSStyleDeclaration]),是只读的。

以前获得某个css样式id时做法：

function $(id){

return document.getElementById(id);

}

例如：

$("xxx").style.width;"100px";--------->此种方法只能拿到内联样式，可读可改！

getComputedStyle(obj).attr;

var boxdom=$("xxx");

getComputedStyle(boxdom).width-------->可以从外联样式里面拿到宽度，但此种方式只能读不能改

getComputedStyle只能在主流浏览器里面使用而在IE678要使用currentStyle

两种方式兼容写法：

function getStyle(obj,attr){其中obj为样式id的名字而attr是样式属性

if( obj.currentStyle){//undefind

return obj.currentStyle[attr];

}else{//主流浏览器

getComputedStyle(obj)[attr];

}

};

第二种兼容写法return obj.currentStyle?obj.currentStyle[attr]:getComputedStyle(obj)[attr];

使用：alert(getStyle(boxdom,"width"));获得宽

xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx

链式调用实现的原理（如$("#id").html(html).css("background","red")）

例如：

var json = {
html:function(fff){增添一个fff形参
dom.innerHTML = html;用实参xxxx改变dom里面原有参数绑定dom
return this;
},
css:function(key,value){
dom.style[key] = value;

return json；------》当后面执行代码要添加css或html时则要把json里面代码复制多次，不灵活！可以改为return this;
return this//(this返回指明当前是什么调用css方法对象);
}
};
return json;
};*/
$("box").html("xxxxxx").css("width","200px");html("xxxxxx")替换div里面的文本，并且xxxx是写入实参，要在html:function(fff)里面添加一个名为fff形参，使其与dom元素绑定，从而使形参变为实参里面输入文本，并用该文本改变dom里面原有文本！

兼容写法：
function $(id){
var dom = document.getElementById(id);
var json = {
html:function(html){
dom.innerHTML = html;
return this;
},
css:function(){
var first = arguments[0];//获取第一个参数
if(arguments.length==1){//如果传入进来的是对象
for(var key in first){
dom.style[key] = first[key];
}
}else{
dom.style[first] = arguments[1];
}
return this;
}
};
return json;
}
$("box").html("GFluckysky....").css({"width":"200px","border":"10px solid red","background":"green","font-$keywordIndex{35}":"20px"});
*/
</script>
</body