在线 Jquery 转 Javascript 工具？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/29149835/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Online Jquery to Javascript tool?
提问by Cesar Mojarro
Are there any tools like http://sharpkit.net/Live.aspxthat will convert jquery to javascript? I have here methods that I have to convert to javascript and am seeking a little more information that can help me convert the jquery elements to javascript and if there is a tool in www that can help would be appreciated, thanks.
有没有像http://sharpkit.net/Live.aspx这样的工具可以将 jquery 转换为 javascript？我在这里有必须转换为 javascript 的方法，并且正在寻求更多信息，可以帮助我将 jquery 元素转换为 javascript，如果 www 中有可以提供帮助的工具，我将不胜感激，谢谢。
addClass: function(element, className) {
//$(element).addClass(className);
//document.element.addClass(className);
//element.addClass(className);
element.(className)
},
removeClass: function(element, className) {
$(element).removeClass(className);
},
toggleClass: function(element, className) {
$(element).toggleClass(className);
},
css: function() {
// read about the arguments object in javascript, very handy....
// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/arguments
var element = arguments[0];
switch(arguments.length) {
case 2:
$(element).css(arguments[1]);
break;
case 3:
$(element).css(arguments[1], arguments[2]);
break;
default:
throw 'simpleQuery.css() called with bad arguments';
}
}
};
/////////here is the modifications where I need some help with the conversion js to jquery in css portion
(function(exports) {
'use strict';
// Your task is to ditch the jQuery from here and just use pure javascript.
// I'd recommend the Mozilla Web API Docs for Element (and google of course)
// https://developer.mozilla.org/en-US/docs/Web/API/Element
exports.simpleQuery = {
addClass: function(element, className) {
//$(element).addClass(className);
//document.element.addClass(className);
//element.addClass(className);
element.classList.add(className)
},
removeClass: function(element, className) {
element.classList.remove(className);
},
toggleClass: function(element, className) {
element.classList.toggle(className);
},
css: function() {
// read about the arguments object in javascript, very handy....
// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/arguments
var element = arguments[0];
switch(arguments.length) {
case 2:
$(element).css(arguments[1]);
break;
case 3:
$(element).css(arguments[1], arguments[2]);
break;
default:
throw 'simpleQuery.css() called with bad arguments';
}
}
};
})(this);
回答by Cesar Mojarro
My classmate Ming was able to answer the css portion of the codeblock;
我的同学明能回答代码块的css部分；
css: function() {
// read about the arguments object in javascript, very handy....
// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/arguments
var element = arguments[0];
switch(arguments.length) {
case 2:
var styles = arguments[1];
for (var property in styles) {
element.style[property] = styles[property];
}
break;
case 3:
element.style[arguments[1]] = arguments[2];
break;
default:
throw 'simpleQuery.css() called with bad arguments';
}
}
回答by Hrithul roshan
$(document).ready(function() {
var waterVolume
function initialFill(){
waterVolume = Math.floor(Math.random() * (150000 - 50000 + 1)) + 50000
initialWidth = $('.resizable_tank').width()
initialHeight = $('.resizable_tank').height()
stabilizeWaterPipe(initialWidth,initialHeight)
}
function stabilizeWaterPipe(currentWidth,currentHeight) {
stableHeight = $('.resizable_tank_pipe').offset().top + $('.resizable_tank_pipe').height() + 8
$('.stable_tank_pipe').css({height: (stableHeight-400)+"px", bottom: "-"+(stableHeight-400)+"px"})
stabilizeCalc(currentWidth,currentHeight)
}
function stabilizeCalc(currentWidth,currentHeight) {
stableTankWidth = $('.stable_tank').width()
stableTankHeight = $('.stable_tank').height()
increasedHeight = parseFloat(currentHeight - stableTankHeight)
// I'm getting problem here to fill the water and transfer it to the cylinder in which it makes both the cylinder makes equal water level would u pls help me with some code.
}
$('.resizable_tank').resizable({
handles: 'e,s,se',
maxWidth: 800,
minWidth: 180,
minHeight: 400,
resize: function(event, ui) {
var currentWidth = ui.size.width;
var currentHeight = ui.size.height;
stabilizeWaterPipe(currentWidth,currentHeight)
}
})
initialFill()
});
回答by Abd Rmdn
try this guid, its explaining how to convert : https://github.com/Hymanocnr/intl-tel-input/wiki/Converting-jQuery-to-JavaScript
试试这个 guid，它解释了如何转换：https: //github.com/Hymanocnr/intl-tel-input/wiki/Converting-jQuery-to-JavaScript
