js-知识集锦

 

CreateTime--2016年9月22日14:37:51
Author:Marydon
js小知识点集锦
1.

JSON.stringify(Obj);//将Object对象转换成json格式的string类型字符串

2.===与==
　　1、对于string,number等基础类型之间的比较，==和===是有区别的
　　　　1）不同类型间比较，

　　　　　　== 比较的是：判断两边转化成同一类型后的值是否相等，
　　　　　　===如果类型不同，其结果就是不等
　　　　2）同类型比较，直接进行“值”比较，两者结果一样
　　2、对于Array,Object等高级类型之间的比较，==和===是没有区别的
　　　　进行“指针地址”比较
　　3、基础类型与高级类型的比较，==和===是有区别的
　　　　1）对于==，将高级转化为基础类型，进行“值”比较
　　　　2）因为类型不同，===结果为false
3.函数内部声明变量的时候，一定要使用var命令。如果不用的话，你实际上声明了一个全局变量！
　　Js代码

function f1(){
    n=999;
}
f1();//需要调用，不能省略
alert(n); //

(function() {
    var Obj2 = {};
    var name = "方法二"; //或Obj2.name = "方法二"
    Obj2.method1 = function() {
        console.log("方法二进行测试");
        return name;
    }
    window.GlobalObj2 = Obj2;
})();
var name = GlobalObj2.method1();//获取的是返回值name
var method = GlobalObj2.method1;//获取的是对象GlobalObj2的method1()方法

UpdateTime--2016年10月16日15:50:02
4.js获取后台数据
　　前提：js代码必须写在本页面中，外部引用的js文件不用使用下面的方法

//方法一
var test = '${model}';
//方法二
var test = '<%=request.getAttribute("model")%>';

　　js里面可以嵌套jstl标签
UpdateTime--2016年10月31日10:06:12
5.

event.keyCode;//获取键的编码 火狐不支持
<script>
    var globalFunction = new GlobalFunction();
    function GlobalFunction () {
        this.listenKeyCode = function listenKeyCode () {
            if (event.keyCode == 13) {//event.keyCode = 9;//tab键
                console.log("您按的是回车键");
            }
        }
    }
</script>
<input type="text" name = "text1" onkeydown = "globalFunction.listenKeyCode()">
注：火狐用的是event.which

7.document.write()与document.out()
　　document.write()会将body标签的内容替换掉；
　　document.out()则只有在jsp页面才能使用，不属于js的范畴
8.appendChild()与insertBefore()

//新建一个div元素节点
var div=document.createElement("div");
div.innerText = "helloworld";
//把div元素节点添加到body元素节点中成为其子节点，但是放在body的现有子节点的最后
document.body.appendChild(div);
//插入到最前面
document.body.insertBefore(div, document.body.firstElementChild);

9.document.createElement();//动态创建元素

var dialog = document.createElement('div');
var img = document.createElement('img');
var btn = document.createElement('input');
var content = document.createElement('span');

10.动态添加样式

　　通用属性用"."，自定义属性用"setAttribute('customizeName','value')"

// 添加class
dialog.className = 'dialog';
//添加id
dialog.id = 'top';
// 属性
img.src = 'close.gif';
// 样式
btn.style.paddingRight = '10px';
// 文本
span.innerHTML = '您真的要GG吗？';
// 在容器元素中放入其他元素
dialog.appendChild(img);
dialog.appendChild(btn);
dialog.appendChild(span);

注：

　　a.8,9,10有连接关系;
　　b.添加class属性调的是"className"
11.event事件
　　window.event代表着事件对象的状态。只有在事件发生时生效。如鼠标、键盘等事件被触发时这个对象才存在。window.event这只在IE下是这样的。他并不是标准。也就是说其他浏览器并不支持。在W3C标准支持的浏览器下事件对向是引发事件函数的第一个参数，参数名随意

//获取event对象
//方法一
var theEvent = window.event || arguments.callee.caller.arguments[0];
//方法二
将event作为参数来传递:
function eventListener(evt){
    var theEvent = window.event || evt;
}

<input id="test" type="text" oncopy="javascript:eventListener(event);"/>

//捕获当前事件作用的对象
var srcElement = theEvent.srcElement? theEvent.srcElement : theEvent.target;

综上：

/**
 * 监听事件，捕获当前事件作用的对象并对该对象执行操作
 * @param {Object} obj
 */
function eventListener(evt){
    //推荐使用
    var theEvent = window.event || arguments.callee.caller.arguments[0] || evt;
    var srcElement = theEvent.srcElement? theEvent.srcElement : theEvent.target;
    alert(srcElement.value);
}

<input id="test" type="text" oncopy="javascript:eventListener(123)"/>

注意：

　　火狐获取事件的方法是：arguments.callee.caller.arguments[0]

UpdateTime--2018年2月28日11:15:16

12.函数内可以嵌套函数

function test() {
    alert(1);
    function test2() {
        alert(2);
    }
    test2();
}
//调用
test();

注意：

　　函数不能放到window.onload函数里面

window.onload = function() {
    function test() {
        alert(1);
    }
    test();// 不执行
}