js日常总结

1.html如何引入css和js文件

css:<link rel="stylesheet" href="css/index1.css(这是我的文件的地址)">

script:<script type="text/javascript" src="js/jquery-3.4.1.min.js(这是我的文件夹的地址)"></script>

2.jquery常用操作

html()方法的返回和设置被选元素的内容(inner HTML)。

js

<script>
  $(document).ready(function(){
            $("#btn1").click(function(){
                $("p").html("Hello world");
            });
        });
</script>

findindex和tostring结合使用查找当前的item是处于数组中第几项:

 table_list = [1,1,2,35,5,9]

        $(document).ready(function(){
            itemNum = table_list.findIndex(function(item){
                return item.toString() = myItem.toString()
            });
        });

val()方法返回或设置被选元素的值

 $(document).ready(function(){
            $("#btn1").click(function(){
                $(":text").val("hello world");
            });
        });

获取select选中项中存在data里面的值

<select  class="mySelect">
     <option value="switch" data-name="开关">开关</option>
     <option value="light" data-name="灯光">灯光</option>
</select>
$(".mySelect").find("option:selected").attr("data-name"); 获取选中项的data-name的值“开关”;
$(".mySelect").val();获取value的值switch。

parselnt将XX转化为number:Number()适用于所有类型,parseInt()和parseFloat()适用于字符串

indexOf 判断myitem是否存在于itemArray数组中,存在返回第一个索引,否则返回-1:

indexOf()方法 是正序查找,lastIndexOf()是倒叙查找//https://www.cnblogs.com/clear93/p/7928218.html

var index = JSON.stringify(itemArray).indexOf(JSON.stringify(myitem));

append 往文档中插入需要的html和值

 $("#btn").click(function(){
            html = '<tr>'
                + '<td>' + '<img src="./images/item.png" alt="">' + '</td>' 
                + '<td>' + '<span>品牌: </span>'  + '<span>' + $(".myValue").val() + '</span>' + '</td>'
                + '</tr>';
                $("list").append(html);

        });

location.reload() 刷新页面

        window.location.reload

attr() 和removeAttr()

$(".input").attr("placeholder", "请输入您的密码")
        $(" input").removeAttr("date-targer");

prop() 和 removeprop()

<script>  
</scrip$("#btn").prop("checked");  //truet>
<label>
<input type="checkbox" value="复选框" id="btn" checked = "true" disabled = "">
</label>

深度理解

<script>
    $(document).ready(function(){
                $("btn").click(function(){
                    $("p").removeAttr("style");
                });
            });
</script>
原文地址:https://www.cnblogs.com/qijiang123/p/11531123.html