Home > Article > Web Front-end > Summary of methods for passing parameters in js (with code)
This article brings you a summary of the methods of passing parameters in js (with code). It has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.
<input type="hidden" name="tc_id" value="{{tc_id}}">
This method is generally used with ajax. The above value uses the template engine
window['name'] = "the window object";
window.localStorage.setItem("name", "xiaoyueyue"); window.localStorage.getItem("name")
Features
1、localStorage 是持久存储,不主动删除 一直存在 sessionStorage 是临时存储,关闭浏览器数据就没了 2、localStorage 可以多窗口共享 sessionStorage 不能多窗口共享数据
My own encapsulated method
function parseParam(url) { var paramArr = decodeURI(url).split("?")[1].split("&"), obj = {}; for (var i = 0; i < paramArr.length; i++) { var item = paramArr[i]; if (item.indexOf("=") != -1) { var tmp = item.split("="); obj[tmp[0]] = tmp[1]; } else { obj[item] = true; } } return obj; }
2. Regular expression method
function GetQueryString(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); var r = window.location.search.substr(1).match(reg); if (r != null) return unescape(r[2]); return null; }
<!--base--> <button id="test1" onclick="alert(id)">test1</button> <!--高级--> <button id="test" name="123" yue="xiaoyueyue" friend="heizi" onclick="console.log(this.getAttribute('yue'),this.getAttribute('friend'))">test</button>
Use This parameter passing was figured out while using art-template. It is no longer necessary to pass only one ID and splice it into several parameters! happy!
var box = document.createElement("p"); box.innerHTML = "<button id='1' data-name='xiaoyueyue' data-age='25' data-friend='heizi' onclick='alertInfo(this)'>点击</button>"; document.body.appendChild(box); // name,age,friend function alertInfo(val) { console.log(val); alert('大家好,我是' + val.dataset.name + ', 我今年' + val.dataset.age + '岁了,我的好朋友是' + val.dataset.friend + ' !') }
Since this can be used, the event.target
method is also available in the event:
Get the current index value according to class , the parameters can be event objects
var getIndexByClass = function (param) { var element = param.classname ? param : param.target; var className = element.classname; var domArr = Array.prototype.slice.call(document.querySelectorAll('.' + className)); for (var index = 0; index < domArr.length; index++) { if (domArr[index] === element) { return index; } } return -1; },
<button data-name="xiaoyueyue">点击</button>
var btn = document.querySelector("button") btn.onclick = function () { alert(this.dataset.name) }
var name = 'xiaoyueyue', age = 25; var box = document.createElement("p"); box.innerHTML = '<button onclick="alertInfo(\'' + name + '\')">点击</button>'; console.log(box) document.body.appendChild(box); // name, age function alertInfo(name, age, home, friend) { alert("我是" + name) }
var name = 'xiaoyueyue', age = '25', home = 'shanxi', friend = 'heizi'; var params = """ + name + "","" + age + "","" + home + "","" + friend + """; var box = document.createElement("p"); box.innerHTML = "<button onclick='alertInfo(" + params + ")'>点击</button>"; console.log(box) document.body.appendChild(box); // name, age,home,friend function alertInfo(name, age, home, friend) { alert("我是" + name + ',' + "我今年" + age + "岁了!") }
var data = [ { "name": "xiaoyueyue", "age": "25", "home": "shanxi", "friend": "heizi" } ] var box = document.createElement("p"); for (var i = 0; i < data.length; i++) { box.innerHTML = "<button id='btn' onclick='alertInfo(id,\"" + data[i].name + "\",\"" + data[i].age + "\",\"" + data[i].home + "\",\"" + data[i].friend + "\")'>点击</button>"; } document.body.appendChild(box); function alertInfo(id, name, age, home, friend) { alert("我是" + name + "," + friend + "是我的好朋友") }
arguments
Objects are local variables available in all (non-arrow) functions . You can use the arguments object to reference a function's arguments within a function. It is an array-like object.
<button onclick="fenpei('f233c7a290ae11e8a0f00050568b2fdd','100','0号 车用柴油(Ⅴ)')">分配</button>
function fenpei() { var args = Array.prototype.slice.call(arguments); alert("我是" + args[2] + "油品,数量为 " + args[1] + " 吨, id为 " + args[0]) }
Related recommendations:
js anonymous function parameter passing method
JS parameters passed to php are garbled
How to use js to pass parameters to php files
The above is the detailed content of Summary of methods for passing parameters in js (with code). For more information, please follow other related articles on the PHP Chinese website!