直接用 data.elem 获取原始 dom，它是原生元素，可读取 .value、.selectedindex 等属性；不在回调中时用 document.getelementbyid() 或 $('#id')[0]。
layui select 的原始 <select></select> DOM 怎么拿到
直接用 data.elem，它就是你写的那个原生 <select></select> 元素，不是 Layui 渲染出来的 <div> 或 <code><dd></dd>。
很多人误以为要从美化后的下拉面板里“找”原始 select，其实完全没必要——Layui 在 form.on('select()') 回调里已经把原始 DOM 通过 data.elem 塞进来了，这是最可靠、最轻量的入口。
-
data.elem是原生<select></select>，可直接读.value、.selectedIndex、.options -
data.othis是渲染后生成的<dd></dd>，只适合改样式或触发 UI 动作，不能当数据源用 - 别用
document.querySelector('select[name="xxx"]')手动查——万一页面有多个同名 select 就错乱了 - 如果没进
form.on回调（比如点击按钮后才取），就用$('#yourSelectId')[0]或document.getElementById('yourSelectId')，前提是 select 有id
为什么不能从渲染出的 <div> 里反推原始对象
<p>Layui 渲染 select 时会生成一整套伪 DOM：<code><div class="layui-form-select"> 包着 <code><dl></dl> 和一堆 <dd></dd>，但这些元素和原始 <select></select> 之间没有稳定、公开的引用关系。靠 data.othis.closest('.layui-form-select').prev('select') 这类路径查找，极易因主题变更、嵌套结构调整或动态重渲染而失效。
- 不同版本的 Layui 对伪 DOM 结构略有差异（比如 2.8.x 和 2.9.x 的 class 名或层级）
- 启用了
lay-search 后，<div> 内部结构会额外加搜索框，<code>prev() 可能跨错节点
- 动态增删
<option></option> 后，若没调 form.render('select')，伪 DOM 和真实 <select></select> 状态不同步，查到的也是错的
动态修改 <option></option> 后如何确保 data.elem 仍可用
data.elem 始终指向原始 DOM，只要你不把它删掉或替换掉，它就一直有效。问题出在「同步」上：Layui 不会自动监听 <select></select> 的子节点变化，所以你手动 appendChild 或 innerHTML 改完 <option></option>，必须立刻调 form.render('select')，否则 data.elem.selectedIndex 可能指向一个已不存在的选项索引。
- 新增
<option></option> 后，立即执行 form.render('select')
-
<option></option> 的 value 必须和对应 <dd></dd> 的 lay-value 完全一致（包括空格、大小写），否则 selectedIndex 查不到正确项
- 如果用 jQuery 动态操作，推荐
$('#mySelect').append('<option value="1">新选项</option>').next('.layui-form-select').find('dl').empty(); 这种写法不安全，应统一走 form.render()
获取自定义属性（如 lay-data）的正确姿势
原始 <select></select> 本身不存 lay-data，那是写在 <option></option> 上的。要读选中项的自定义字段，得先定位到当前选中的 <option></option>，再取它的属性。
- 在
form.on('select(xxx)') 回调里：$(data.elem).find('option:selected').attr('lay-data')
- 不在回调里（比如按钮触发）：
$('#mySelect option:selected').attr('lay-data')
- 不要用
data.othis.attr('lay-data') —— data.othis 是 <dd></dd>，它可能没同步 lay-data，尤其在动态更新后
-
lay-data 值是字符串，JSON 类型需手动 JSON.parse()，注意捕获语法错误
原始 <select></select> DOM 本身很简单，难的是保证它和 UI 状态始终一致——关键就在「改完 option 必 render，读之前先确认是否在回调内」。其他所有绕路方案，都是在给未来埋坑。
lay-search 后，<div> 内部结构会额外加搜索框，<code>prev() 可能跨错节点
<option></option> 后，若没调 form.render('select')，伪 DOM 和真实 <select></select> 状态不同步，查到的也是错的动态修改 <option></option> 后如何确保 data.elem 仍可用
data.elem 始终指向原始 DOM，只要你不把它删掉或替换掉，它就一直有效。问题出在「同步」上：Layui 不会自动监听 <select></select> 的子节点变化，所以你手动 appendChild 或 innerHTML 改完 <option></option>，必须立刻调 form.render('select')，否则 data.elem.selectedIndex 可能指向一个已不存在的选项索引。
- 新增
<option></option>后，立即执行form.render('select') -
<option></option>的value必须和对应<dd></dd>的lay-value完全一致（包括空格、大小写），否则selectedIndex查不到正确项 - 如果用 jQuery 动态操作，推荐
$('#mySelect').append('<option value="1">新选项</option>').next('.layui-form-select').find('dl').empty();这种写法不安全，应统一走form.render()
获取自定义属性（如 lay-data）的正确姿势
原始 <select></select> 本身不存 lay-data，那是写在 <option></option> 上的。要读选中项的自定义字段，得先定位到当前选中的 <option></option>，再取它的属性。
- 在
form.on('select(xxx)')回调里：$(data.elem).find('option:selected').attr('lay-data') - 不在回调里（比如按钮触发）：
$('#mySelect option:selected').attr('lay-data') - 不要用
data.othis.attr('lay-data')——data.othis是<dd></dd>，它可能没同步lay-data，尤其在动态更新后 -
lay-data值是字符串，JSON 类型需手动JSON.parse()，注意捕获语法错误
<select></select> DOM 本身很简单，难的是保证它和 UI 状态始终一致——关键就在「改完 option 必 render，读之前先确认是否在回调内」。其他所有绕路方案，都是在给未来埋坑。
