jQuery/JavaScript：以简单的方式将像素转换为em

我正在寻找一个简单的方法来添加一行代码到我的插件，将几个像素值转换为em值，这是因为我的项目的布局需要在em的。有没有一个简单的方法来做到这一点，因为我不想添加第三方插件到该网站。

不会在这里发布代码，因为它与插件自身无关。

谢谢。

示例：13px – > ?? EM

解决方法

我认为你的问题非常重要。由于显示分辨率的类别正在快速增长，使用em定位来支持各种屏幕分辨率是一个非常有吸引力的方法。但是无论您尝试如何努力保持所有内容 – 有时您可以从JQuery拖放或从另一个库获取像素值，并且您需要将该值转换为em，然后再将其发送回服务器才能执行持久性。这样，下一次用户查看页面时，项目将处于正确的位置 – 无论其使用的设备的屏幕分辨率如何。

JQuery插件不是很可怕，当您可以查看代码，特别是如果它们像this plugin to convert pixel values to em一样简短而甜蜜，你想要的。其实这是很短的我会把整个事情粘在这里。有关版权声明，请参阅链接。

$.fn.toEm = function(settings){
    settings = jQuery.extend({
        scope: 'body'
    },settings);
    var that = parseInt(this[0],10),scopeTest = jQuery('<div style="display: none; font-size: 1em; margin: 0; padding:0; height: auto; line-height: 1; border:0;">&nbsp;</div>').appendTo(settings.scope),scopeVal = scopeTest.height();
    scopeTest.remove();
    return (that / scopeVal).toFixed(8) + 'em';
};


$.fn.toPx = function(settings){
    settings = jQuery.extend({
        scope: 'body'
    },settings);
    var that = parseFloat(this[0]),scopeVal = scopeTest.height();
    scopeTest.remove();
    return Math.round(that * scopeVal) + 'px';
};

使用示例：$(myPixelValue).toEm();或$(myEmValue).toPx();.

我在我的应用程序中测试了这个，它的效果很好。所以我以为我分享