dojo 切换css_对Dojo中CSS样式分配进行故障排除

dojo 切换css

I was recently working on a Dojo project which used a series of JavaScript calculations to generate CSS style values. While calculating styles with JavaScript is quite common, especially when attempting to dynamically position HTML nodes, values aren't always cleansed the way that they should be. Safari and Firefox appear to ignore invalid style values but Internet Explorer tends to throw errors when a bad style or value is assigned to a node. After digging through tons of code to find a possible problem, I chose create a modified dojo.style snippet which would help me find problem styles.

我最近正在做一个Dojo项目，该项目使用一系列JavaScript计算来生成CSS样式值。 尽管使用JavaScript计算样式非常普遍，尤其是在尝试动态定位HTML节点时，值并不一定总是按照其应有的方式清除。 Safari和Firefox似乎忽略了无效的样式值，但是当将错误的样式或值分配给节点时，Internet Explorer往往会引发错误。 在挖掘了大量代码以查找可能的问题之后，我选择创建一个经过修改的dojo.style代码段，该代码段将帮助我查找问题样式。

Dojo工具包JavaScript (The Dojo Toolkit JavaScript)

The snippet is actually quite small and only adds to Dojo's native dojo.style method:

该代码段实际上很小，仅添加到Dojo的本机dojo.style方法中：

//save original method
var oldDojoStyle = dojo.style;
//create our own custom version
dojo.style = function() {
	//debug
	if(arguments.length == 3) {
		//make arguments readable
		var node = arguments[0], attribute = arguments[1], value = arguments[2];
		//decide to warn or log
		var method = (value == undefined || value == null || value == '' || value.toString().indexOf('NaN') != -1 ? 'warn' : 'log' );
		//execute!
		console[method]('Setting "' + attribute + '" to: "' + value + '" on ',node,';; arguments: ',arguments);
	}
	//call origonal method
	oldDojoStyle.apply(dojo, arguments);
}

The first step is saving the original dojo.style method so it may be called from the new dojo.style method we create. Then we create a new dojo.style method declaration which contains a series of console.log/warn logic to output invalid CSS values, like null, undefined, and NaN. When a potentially bad value is provided, a console.warn warning is sent to the console.

第一步是保存原始的dojo.style方法，以便可以从我们创建的新dojo.style方法中调用它。 然后，我们创建一个新的dojo.style方法声明，该声明包含一系列console.log / warn逻辑，以输出无效CSS值，例如null，undefined和NaN。 当提供潜在的错误值时，会向控制台发送console.warn警告。

A sample bit of output would be:

输出的样本位为：

You could use an alert() call to make the error more noticeable but I prefer using console because I can pass the actual arguments object to the console to get more information about the issue.

您可以使用alert()调用使错误更明显，但我更喜欢使用控制台，因为我可以将实际的参数对象传递给控制台以获取有关该问题的更多信息。

And there you have it. I know this is super simple but it can also save you lots of time in finding what style assignment is causing you problems!

那里有。 我知道这非常简单，但是它也可以节省您很多时间，以查找导致您遇到问题的样式分配！

翻译自: https://davidwalsh.name/dojo-css

dojo 切换css