精华内容
下载资源
问答
  • js原生方法map实现 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta ...
  • javascript/js的ajax的GET请求: [removed] /* 创建 XMLHttpRequest 对象 */ var xmlHttp; function GetXmlHttpObject(){  if (window.XMLHttpRequest){  // code for IE7+, Firefox, Chrome, Opera, Safari  ...
  • javascript原生表格

    2018-11-04 20:00:12
    javascript原生表格javascript原生表格javascript原生表格
  • 简单的粒子星空特效,使用纯原生js 没有使用任何插件,简单易懂,一看就明白,自己对js+canvas的一些简单的理解
  • js原生卡片式轮播图.zip
  • 50款原生js案例(绝美整合),半年整理的库存,各种js插件库存,效果,绝对有您喜欢的效果!
  • 主要介绍了vue 使用外部JS与调用原生API操作,结合实例形式分析了vue.js调用外部JS原生API相关操作技巧及注意事项,需要的朋友可以参考下
  • 原生js时间插件(带时分秒)并兼容ie,可实现选择年月日及选择时分秒;
  • JavaScript原生拼图游戏

    2020-03-19 21:45:08
    使用 html+js+css 实现一个网页拼图游戏,可支持简单,中等,困难三种难度。完成拼图会显示所用的时间和步数。
  • 本文实例为大家分享了js中RSA和AES加密解密详细代码,供大家参考,具体内容如下 <!doctype html> <html> <head> <meta charset='UTF-8'> </head> <body> <div class='test'>...
  • js原生请求

    千次阅读 2019-03-20 15:53:37
    js原生请求get var httpRequest = new XMLHttpRequest();//第一步:建立所需的对象 httpRequest.open('GET', 'url', true);//第二步:打开连接 将请求参数写在url中 ps:"./Ptest.php?name=test&nameone=...

    js原生请求get

    var httpRequest = new XMLHttpRequest();//第一步:建立所需的对象

    httpRequest.open('GET', 'url', true);//第二步:打开连接 将请求参数写在url中 ps:"./Ptest.php?name=test&nameone=testone"

    httpRequest.send();//第三步:发送请求 将请求参数写在URL中

    /**

    * 获取数据后的处理程序

    */

    httpRequest.onreadystatechange = function () {

    if (httpRequest.readyState == 4 && httpRequest.status == 200) {

    var json = httpRequest.responseText;//获取到json字符串,还需解析

    console.log(json);

    }

    };

    js原生请求post

    var httpRequest = new XMLHttpRequest();//第一步:创建需要的对象

    httpRequest.open('POST', 'url', true); //第二步:打开连接

    httpRequest.setRequestHeader("Content-type","application/x-www-form-urlencoded");//设置请求头

    注:post方式必须设置请求头(在建立连接后设置请求头)

    httpRequest.send('name=teswe&ee=ef');//发送请求 将情头体写在send中

    /**

    * 获取数据后的处理程序

    */

    httpRequest.onreadystatechange = function () {//请求后的回调接口,可将请求成功后要执行的程序写在其中

    if (httpRequest.readyState == 4 && httpRequest.status == 200) {//验证请求是否发送成功

    var json = httpRequest.responseText;//获取到服务端返回的数据

    console.log(json);

    }

    };

     

     

     

    展开全文
  • 原生js轮播图

    2018-07-02 22:40:13
    原生js写的轮播图,样式写的很好看.参考了大多数网站的轮播图样式和功能,实现方法简单巧妙,注释也比较丰富.
  • js 原生代码功能

    2014-06-10 16:02:42
    原生JavaScript功能代码
  • 常用的JS原生方法

    2020-03-04 10:59:06
    常用的JS原生方法 最近做项目用到了js一些常用的原生方法,谨记以下: 1. 常用的JS原生方法: var bgdiv = window.document.getElementById("div_demo_id"); if (!bgdiv) { bgdiv = window.document....

    常用的JS原生方法

    最近做项目用到了js一些常用的原生方法,谨记以下:
    #心得#:多撸文档,总有意外收获!

    1. 常用的JS原生方法:
    var bgdiv = window.document.getElementById("div_demo_id");
    if (!bgdiv) {
    	bgdiv = window.document.createElement("div");
    	bgdiv.id = "div_demo_id";
    	window.document.getElementsByTagName("BODY")[0].appendChild(bgdiv);
    }
    var iWidth = document.documentElement.clientWidth;
    var iHeight = document.documentElement.clientHeight;
    if (!height)
    	height = 30;
    var scrollTop = document.documentElement.scrollTop;
    if (!scrollTop) {
    	scrollTop = document.body.scrollTop;// IE
    }
    bgdiv.className = "div_demo_class";
    bgdiv.style.cssText = "position:absolute;height:" + height+ "px;left:" + (iWidth - 200) / 2 + "px;top:"+ ((iHeight - height) / 2 + scrollTop - 72)+ "px;z-index:9999;text-align:center;";
    bgdiv.style.display = "block";
    bgdiv.style['z-index'] = 9999;	//重要!!	(不知道的转不过来,竟然可以用[],哈哈哈哈)
    bgdiv.innerHTML = "<div>Hello Word !</div>";
    bgdiv.setAttribute("属性","值");
    bgdiv.getAttribute("属性");
    
    • document.getElementById 根据Id,获取元素
    • document.createElement 创建元素
    • document.getElementsByTagName 根据元素名称,获取元素(返回数组)
    • appendChild 追加元素
    • document.documentElement.clientWidth 获取宽高
    • document.documentElement.clientHeight 获取宽高
    • document.documentElement.scrollTop 滚动条位置
    • document.body.scrollTop 滚动条位置
    • xxx.className 设置class属性值
    • xxx.innerHTML 插入html代码
    • xxx.style.cssText 设置样式内容
    • xxx.style.display 设置样式内容

    2. 获取元素、查找元素:
    • document.querySelector(element); 查找元素,支持class、id等
      (大部分jquery支持的写法,如“div.mi-body”),本方法仅支持IE8及以上使用。
    • getElementsByClassName; 根据class名称查找,返回元素数组
    • getElementsByTagName();
    • getElementById();
    • getElementsByName();
    • xxx.parentNode 获取上级元素
    • xxx.parentNode.removeChild(xxx); //删除元素

    3.复制文字

    input.select();
    document.execCommand(“copy”)

    function copyText(text) {
    		var copy_input = window.document.getElementById("copy_input");
    		if (!copy_input) {
    			copy_input = window.document.createElement("input");
    			copy_input.id = "copy_input";
    			window.document.getElementsByTagName("BODY")[0].appendChild(copy_input);
    		}
    		copy_input.style.display = "block";
    		copy_input.value = text;
    		copy_input.select();
    		if (document.execCommand("copy"))
    			layer.msg("复制成功" + text);
    		copy_input.style.display = "none";
    }
    
    4.模拟滚动屏幕(到顶部or到底部)

    模拟手滑动屏幕效果(可扩展为到顶部or到底部)
    高度可以控制,例如0,或dom.offsetHeight。

    • 使用jQuery(有动画)
    var height= $(window).height(), scrollTop = Math.max($('#xx-container').scrollTop(), height);
    $('#xx-container').animate({
    	scrollTop : parseInt(scrollTop + (height * 0.8)) + 'px'
    }, 'slow');
    
    • 使用JS(无动画)

    说明:js如需要动画效果,可以将height使用setTimeout分段滚动。

    var bgdiv = window.document.getElementById("search-inaccount-content");
    if (bgdiv) {
    	bgdiv.scrollBy(0, height);
    }
    
    5.动态加载图片、动态加载js…
    	var oScript = document.createElement("script");
    	oScript.src = fileServer + '/js/stream-v1.js';
    	oScript.onload = oScript.onreadystatechange = function() {
    		if (this.complete || this.readyState == "loaded" || this.readyState == "complete") {
    			//@-操作
    		}
    	};
    

    onload、complete 为普通浏览器
    onreadystatechange、readyState 为IE浏览器事件

    var ohd = document.getElementsByTagName('HEAD').item(0),v=new Date().getTime(),ot0 = document.createElement('script');
    ot0.src = 'https://www.showdoc.com.cn/static/jquery.min.js?v='+ v;
    ohd.appendChild(ot0);ohd.appendChild(ot0);
    

    其它说明:

    浏览器控制台中,可以使用js进行页面的数据操作(比如引入jquery,引入js文件,追加元素等)。


    【备份地址】

    展开全文
  • Js原生ajax与跨域(代理)上传文件:JS原生模拟ajax请求与实现ajax跨域代理上传文件和jquery跨域上传文件Dome
  • JavaScript原生自动触发事件

    千次阅读 2020-05-11 09:06:47
    在有些情况下,我们需要程序逻辑自动触发元素的事件,例如js提供了click(), form提供了reset(),submit()等方法!在jquery中提供了trigger()方法帮助我们自动触发事件,原理是什么呢?接下来让我们一探究竟! 一、...

     在有些情况下,我们需要程序逻辑自动触发元素的事件,例如js提供了click(), form提供了reset(),submit()等方法!在jquery中提供了trigger()方法帮助我们自动触发事件,原理是什么呢?接下来让我们一探究竟!

    一、eventType

    eventType共有5种类型:

    • HTMLEvents:包括 'abort', 'blur', 'change', 'error', 'focus', 'load', 'reset', 'resize', 'scroll', 'select', 'submit', 'unload'.

    • UIEevents :包括 'DOMActivate', 'DOMFocusIn', 'DOMFocusOut', 'keydown', 'keypress', 'keyup'.

    • MouseEvents:包括 'click', 'mousedown', 'mousemove', 'mouseout', 'mouseover', 'mouseup'.

    • MutationEvents:包括 'DOMAttrModified', 'DOMNodeInserted', 'DOMNodeRemoved','DOMCharacterDataModified','DOMNodeInsertedIntoDocument', 'DOMNodeRemovedFromDocument', 'DOMSubtreeModified'.

    上述加粗的是经常会用到的事件类型

    二、createEvent(eventType)

    eventType=MouseEvents,触发事件为click为例:

    document.body.onclick=function(){
        alert("hello")
    }
    var event = document.createEvent('MouseEvents');
    // initEvent接受3个参数:
    // 事件类型,是否冒泡,是否阻止浏览器的默认行为
    event.initEvent("click", false, true);
    //触发document上绑定的click事件
    document.body.dispatchEvent(event);
    

    通过el.dispatchEvent触发事件,聪明的你有没有想到vue里的$emit?

    三、自定义事件

    document.body.addEventListener("veb",function(e){
             alert(e.eventType)
    })
    var event = document.createEvent('HTMLEvents');
    // initEvent接受3个参数:
    // 事件类型,是否冒泡,是否阻止浏览器的默认行为
    event.initEvent("veb", false, true);
    //通过eventType传递事件信息
    event.eventType="I love Veblen"
    //触发document上绑定的click事件
    document.body.dispatchEvent(event);

     示例

    /*<input id="buttonid" type="button" value="按钮" onclick="alert('这是自动点击弹窗')" />*/
    
    		<script type="text/javascript">
    			setInterval(function() {
    				if (document.all) {
    					document.getElementById("buttonid").click();
    				} else {
    					var e = document.createEvent("MouseEvents");
    					e.initEvent("click", true, true);
    					document.getElementById("buttonid").dispatchEvent(e);
    				}
    			}, 2000);
    		</script>

     

    展开全文
  • js原生实现滚动条效果
  • 飞机大战坦克是一款小游戏,相信很多朋友都有玩过,由于最近在深入学习Javascript,所以想着用利用Javascript来实现这个游戏,下面这篇文章主要介绍了如何利用JavaScript原生编写《飞机大战坦克》游戏,需要的朋友...
  • 使用原生javascript技术实现了简单的增删改查功能,使用了localstorage本地存储。
  • 手写cookie操作功能,纯正,有效,适合所有开发者使用。 使用:1、引入Cookie.js; 2、存储:Cookie.setCookie('name','andy'); 3、获取:Cookie.getCookie('name');
  • JS原生面试题.zip

    2019-11-13 19:06:59
    关于javascript的企业面试题经典题型总结,汇集千万前端开发前辈们的面试经验总结,适合于各大it企业的求职小白
  • js原生选项卡

    2018-09-03 15:03:22
    简单易懂,希望能帮助到刚刚开始学习js的同学,欢迎下载!
  • js原生实现表格行的
  • 简单的利用原生js实现打飞机游戏,代码易懂,没有复杂的逻辑,适用于初学js的新手练习
  • 原生JS经典案例特效

    2018-10-26 15:11:18
    30多套JavaScript的案例库,动画效果。360度全景展示效果,back_评分,back_图片滚动播放,JS简易年历,slide上下滚动条,放大镜简单版,竖排导航,土豆右下角菜单悬浮效果,照片墙一多实例演示_files,back_瀑布流...
  • js原生轮播实例

    2018-04-03 11:45:24
    js原生轮播实例,自己用js原生写的一个demo,供大家参考,请大家指教。
  • h5 js原生时钟

    2018-10-11 16:51:54
    h5 js原生时钟
  • 下面小编就为大家带来一篇JavaScript之事件委托实例(附原生js和jQuery代码)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 262,091
精华内容 104,836
关键字:

js原生