Layui使用select标签不显示的问题

Layui使用select元素或者其他表单元素不显示或异常的问题

问题

select元素没有被Layui正确地渲染.
HTML中select元素消失(实际上Layui会先隐藏select元素,然后再生成一个新的,但是我的情况是光隐藏了,没生成)

查找原因

出问题的代码

<!-- 父元素的class="layui-form" -->
<form class="layui-form">
	<div class="layui-input-inline">
		<!-- name属性值为nodeType或nodeName会导致冲突 -->
		<select name="nodeType" lay-filter="code">
			<option value="1" >1</option>
			<option value="2" >2</option>
		</select>
	</div>
</form>
<script>
	// 引入form模块
	layui.use('form', function(){
  		var form = layui.form;
  	}
</script>
});

先看官方文档
Layui关于表单的官方文档

你必须给表单体系所在的父元素加上class=“layui-form”，一切的工作都会在你加载完form模块后，自动完成。

检查父元素是否有class属性layui-form,以及是否引入form模块，我的代码问题不是出在这里

继续测试，最后发现是name属性的值出了问题
当select标签的name属性为 nodeType或者nodeName时会导致Layui不会渲染 select元素.最要命的是没有任何报错，找了半天才发现是name属性的值可能导致了冲突。

解决方案

先根据官方文档检查父元素的class元素是否有layui-form，再检查js部分是否引入form模块。

如果上面两步检查完毕，再看看name或者其他属性是否用了一些可能冲突的单词。我这次遇到的是属性值为nodeType或nodeName发生了冲突，替换掉就好了，或许还有其他的。

参考链接

jquery冲突的关键字nodeName、nodeValue和nodeType

MDN关于Node的说明