记录~js中一些特别的用法

 

目录

1.在js中链接外部css样式

2.HTML表单添加自定义属性，通过自定义属性获取input标签

3.输入框绑定事件

---

环境参数：引用js的类库jQuery

1.在js中链接外部css样式

$(function(){

    // 加载样式
    var link = document.createElement('link');
    link.setAttribute('rel', 'stylesheet');
    link.setAttribute('type', 'text/css');
    link.setAttribute('href', 'http://127.0.0.1:8080/test.css');
    document.head.appendChild(link);

});

2.HTML表单添加自定义属性，通过自定义属性获取input标签

<label>测试：</label>
<input type="text" id="testId" onfocus="test(this)"  zidingyi="zidingyi" value="" />

<script>
    var i = 1;
    function test(obj) {
        // 获取自定义属性值
        var attr = $(obj).attr("zidingyi");
        // 设置自定义属性值
        $(obj).attr("zidingyi", attr + i);
        i++;
        attr = $(obj).attr("zidingyi");
        // 通过自定义属性值获取input标签
        console.log($("input[zidingyi='"+ attr +"']").attr("zidingyi"));
        $("input[zidingyi='"+ attr +"']").val("123456");
    }
</script>

3.输入框绑定事件

<label>测试2：</label>
<input type="text" id="testId2"  value="" placeholder="请输入..."/>


<script>

    $(function () {
        // 输入框的值改变时触发
        $("#testId2").bind('input propertychange',function () {
            var text = $("#testId2").val();
            var regexp = /[\d]/g;
            if (regexp.test(text)) {
                console.log(text);
            }
        });
        // 输入框聚焦时触发
        $('#testId2').bind('focus', function() {
                console.log("focus");
            });

        });

</script>