1.When child component trigger an event it comes as detail if event trigger by DOM then comes as target.
2. event.target comes from html element
event.detail comes from custom event we write

I don't understand this from a code point. Both the codes are almost same. We are using combobox with onchange handler in both the components.
 Why did we use event.detail in the first component but we used event.target in the second component?
I have two components below. In one component we have event.detail and another we have event.target. 
Can someone please explain based on the below code?
Component 1: Wire service with getPicklistValues adapter 
HTML:
<template>
    <lightning-card title="getPicklistValues Demo">
        <div class="slds-var-p-around_medium">
            <lightning-combobox
            name="Industry"
            label="Industry"
            value={selectedIndustry}
            placeholder="Select Industry"
            options={industryOptions}
            onchange={handleChange} ></lightning-combobox>
        </div> 
        <p>selectedIndustry:{selectedIndustry}</p>
    </lightning-card>
    <lightning-card title="getPicklistValues Demo with type">
        <div class="slds-var-p-around_medium">
            <lightning-combobox
            name="Type"
            label="Type"
            value={selectedType}
            placeholder="Select Type"
            options={typeOptions}
            onchange={handleTypeChange} ></lightning-combobox>
        </div> 
        <p>selectedType:{selectedType}</p>
    </lightning-card>
</template>
JS:
 import { LightningElement, wire } from 'lwc';
import { getObjectInfo, getPicklistValues} from 'lightning/uiObjectInfoApi'
import INDUSTRY_FIELD from '@salesforce/schema/Account.Industry'
import TYPE_FIELD  from '@salesforce/schema/Account.Type'
import ACCOUNT_OBJECT from '@salesforce/schema/Account'
export default class GetPIcklistValuesDemo extends LightningElement {
    selectedIndustry = '';
    selectedType=''
    industryOptions=[]
    typeOptions=[]
    @wire(getObjectInfo, {objectApiName:ACCOUNT_OBJECT})
    objectInfo
    @wire(getPicklistValues, { recordTypeId:'$objectInfo.data.defaultRecordTypeId', fieldApiName:INDUSTRY_FIELD})
    industryPicklist({data, error}){
        if(data){
            console.log(data)
            this.industryOptions = [...this.generatePicklist(data)]
        }
        if(error){
            console.error(error)
        }
    }
    generatePicklist(data){
        return data.values.map(item=>({ label: item.label, value: item.value }))
    }
    handleChange(event) {
        this.selectedIndustry = event.detail.value;
    }
    /***second picklist for type */
    @wire(getPicklistValues, { recordTypeId:'$objectInfo.data.defaultRecordTypeId', fieldApiName:TYPE_FIELD})
    typePicklist({data, error}){
        if(data){
            console.log(data)
            this.typeOptions = [...this.generatePicklist(data)]
        }
        if(error){
            console.error(error)
        }
    }
    handleTypeChange(event) {
        this.selectedType = event.detail.value;
    }
}
Component 2: Wire service with getPicklistValuesByRecordType adapter 
HTML:
<template>
    <lightning-card title="getPicklistValuesByRecordType Adapter">
        <div class="slds-var-p-around_medium">
            <template if:true={ratingOptions}>
                <lightning-combobox
                name="rating"
                label="Rating"
                value={selectedRating}
                placeholder="Select Rating"
                options={ratingOptions}
                onchange={handleChange}></lightning-combobox>
                <p>selectedRating: {selectedRating}</p>
            </template>
            
            <template if:true={industryOptions}>
                <lightning-combobox
                name="industry"
                label="Industry"
                value={selectedIndustry}
                placeholder="Select Industry"
                options={industryOptions}
                onchange={handleChange}></lightning-combobox>
                <p>selectedIndustry: {selectedIndustry}</p>
            </template>
        </div>
    </lightning-card>
</template>
JS:
import { LightningElement, wire } from 'lwc';
import {getPicklistValuesByRecordType, getObjectInfo} from 'lightning/uiObjectInfoApi'
import ACCOUNT_OBJECT from '@salesforce/schema/Account'
export default class GetPicklistValuesByRecordTypeDemo extends LightningElement {
    ratingOptions
    industryOptions
    selectedRating
    selectedIndustry
    @wire(getObjectInfo, {objectApiName:ACCOUNT_OBJECT})
    objectInfo
    @wire(getPicklistValuesByRecordType, {objectApiName:ACCOUNT_OBJECT, 
        recordTypeId:'$objectInfo.data.defaultRecordTypeId'})
        picklistHandler({data, error}){
            if(data){
                console.log(data)
                this.ratingOptions = this.picklistGenerator(data.picklistFieldValues.Rating)
                this.industryOptions = this.picklistGenerator(data.picklistFieldValues.Industry)
            }
            if(error){
                console.error(error)
            }
        }
    picklistGenerator(data){
        return data.values.map(item=>({"label":item.label, "value":item.value}))
    }
    handleChange(event){
        const {name, value} = event.target
        console.log(name +'==>' +value)
        if(name === 'industry'){
            this.selectedIndustry = value
        }
        if(name === 'rating'){
            this.selectedRating = value
        }
    }
}